Add Expand collapse link conditionally for node

GoXam
#1

Hi,

Our node is like

In this node we are showing Description, ID and Synonym. Parent+ & child+ are two buttons on click of them we show Parent and child of selected node respective.<?: prefix = o ns = "urn:schemas-microsoft-com:office:office" />

In some case our description is very long so it appears in multiple lines. Like in above example our description "test aaa bbb bbb ccc ccc ddd ddd" is coming in 2 lines.

Requirement: we want our description would come in only one line so for that we want that if description is more than 10 characters then it would come like

First 8 charcter + “>>” appended to it

i.e. our description should look like “test aaa>>”like below

Now if we click on >> of description then it should expand the node like below with << appended in description, like below

Now if we click on << of description then node should again look like
how can we achieve this feature? ">>" & ">>" can be any link button
Other Info:
We are using following layout
<go:Diagram.Layout> <golayout:LayeredDigraphLayout LayerSpacing="75" ColumnSpacing="8" > </golayout:LayeredDigraphLayout> </go:Diagram.Layout>
Thanks
Hardik

#2

If I were you I would implement a converter that produced the desired string based on the node data, along with a mouse click event handler for the whole TextBlock (not just the “<<” or “>>”) that would toggle the behavior of the converter.

That would keep the information up-to-date if the data property changed, and makes it easier for users to toggle the amount that is shown.

#3

As per your suggestion I have added converter and now at first time when description is greater than 10 character then it's showing description in correct format.Since we have to show full description on click of current description text with”<

<go:NodePanel Sizing="Auto" go:Node.LinkableFrom="{Binding Path=AllowLink, Source={StaticResource graphControlBindingSettings}}" go:Node.LinkableTo="{Binding Path=AllowLink, Source={StaticResource graphControlBindingSettings}}" > <Path go:NodePanel.Figure="Rectangle" Fill="{Binding Path=Data.NodeColor}" /> <StackPanel> <TextBlock Text="{Binding Path=Data.InnerTermData.Name, Converter={StaticResource graphNodeDescLengthConvertor}}" MinWidth="130" MaxWidth="130" TextWrapping="Wrap" HorizontalAlignment="Left" Visibility="{Binding Data.DescriptionVisibility}" KeyDown="txtGraphNodeDesc_KeyDown" KeyUp="txtGraphNodeDesc_KeyUp"/> <StackPanel Orientation="Horizontal" Visibility="{Binding Data.IdVisibility}"> <TextBlock Text="{Binding Text,ElementName=txtblkId}"/> <TextBlock Text="{Binding Path=Data.InnerTermData.PK}"/> </StackPanel> <StackPanel Orientation="Horizontal" Visibility="{Binding Data.SynonymVisibility}"> <TextBlock Text="{Binding Text,ElementName=txtblkSynonym}" Width="30"/> <TextBlock Text="{Binding Path=Data.InnerTermData.Synonym}" Foreground="Blue" TextWrapping="Wrap" MinWidth="100" MaxWidth="100"/> </StackPanel> </StackPanel> </go:NodePanel>

Can you please suggest why the event is not triggering?

#4

Can you please provide any sample what exactly should i do?

#5

Don’t you want the MouseLeftButtonDown event instead of a keyboard event?

#6

we can’t use MouseLeftButtonDown.

I tried this event but it's creating problem for our existing functionality. Since we have drag and drop feature for our node also.
can we have">>" and "<<" as button and add their click event?
If yes then please send sample for that.
Note: if description is less than 10 character then we will not have "<>" button so our button should also create run time based on condition
#7

At this moment I have way too many people asking for help, so I cannot produce this code for you.
But I think it is pretty easy to add a Button that does what you want and is visible only when you want.