(UTC)
  The MindFusion Forums › Flow Diagramming Components › Html Canvas & JavaScript › Vertically Center-align Content for Shape Node
(Moderator: Slavcho)
‹ Previous Topic | Next Topic ›
Page Index Toggle Pages: 1 Send TopicPrint
Normal Topic Vertically Center-align Content for Shape Node (Read 2527 times)
Santosh
YaBB Newbies
*
Offline


I Love MindFusion!

Posts: 28
Joined: Mar 25th, 2015
Vertically Center-align Content for Shape Node
Aug 14th, 2015 at 7:25pm
Print Post  
Hi,

How to vertically center-align the ShapeNode contents (Image and Text)
I have used the following code:

var sourceNode = diagram.getFactory().createShapeNode(30,30,30,30);
sourceNode.setShape('Circle');
sourceNode.setBrush('#CEF6F5');
sourceNode.setStroke('#30a9c0');
sourceNode.setFont(new Font("Helvetica Neue", 4));
sourceNode.setTextColor('black');
sourceNode.setImageLocation(imgIcons[objType]);
sourceNode.setTextAlignment(Alignment.Center);
sourceNode.setImageAlign(ImageAlign.TopCenter);
  
ST2.png ( 11 KB | 137 Downloads )
ST2.png
Back to top
 
IP Logged
 
Stoyo
God Member
*****
Offline


MindFusion support

Posts: 13230
Joined: Jul 20th, 2005
Re: Vertically Center-align Content for Shape Node
Reply #1 - Aug 15th, 2015 at 6:09am
Print Post  
Hi,

You can align text to the bottom by calling node.setLineAlignment(Alignment.Far); You could as well implement custom placement of Text and Image objects:

Code
Select All
ShapeNode.prototype.onUpdateVisuals = function ()
{
	var r = this.getBounds().clone();
	if (this.image)
	{
		r.y += 2; r.height /= 2;
		this.image.setBounds(r);
	}
	this.text.setBounds(
		Rect.fromLTRB(
			r.x,
			this.image ? this.image.bounds.bottom() + 1 : 1,
			r.right(),
			this.getBounds().bottom() - 1));
};


I hope that helps,
Stoyan
  
Back to top
 
IP Logged
 
Santosh
YaBB Newbies
*
Offline


I Love MindFusion!

Posts: 28
Joined: Mar 25th, 2015
Re: Vertically Center-align Content for Shape Node
Reply #2 - Aug 17th, 2015 at 6:54am
Print Post  
Thanks Stoyo, that fixed it! Smiley
  
Back to top
 
IP Logged
 
Page Index Toggle Pages: 1
Send TopicPrint
‹ Previous Topic | Next Topic ›
 
  « Board Index ‹ Board Top  

The MindFusion Forums » Powered by YaBB 2.6.11!
YaBB Forum Software © 2000-2024. All Rights Reserved.

Valid RSS Valid XHTML Valid CSS Powered by Perl Source Forge