CODEWITHSUNDEEP
c#wpfdata-bindingmvvm
Yogevnn
Yogevnn

Reputation: 1510

WPF converters (MVVM)

I need a little help with converters (My WPF skills are low).

I have an object on which I want to change a fill brush property.

This is the Data template for "Node" object I marked the value I want to change in Bold (I deleted some of non relevant data in the data template to keep it simple)

          <!-- Define a data-template for the 'NodeViewModel' class. -->    
        <DataTemplate
            DataType="{x:Type local:NodeViewModel}"
            >

                <Grid
                    MinWidth="120"
                    Margin="10,6,10,6"
                    SizeChanged="Node_SizeChanged"
                    >

                    <!-- This rectangle is the main visual for the node. -->

                    <Rectangle
                        Stroke="{StaticResource nodeBorderBrush}"
                        StrokeThickness="1.3"
                        RadiusX="4"
                        RadiusY="4"
                        **Fill="{StaticResource nodeFillBrush}"**
                        />

                        <!-- The name of the node. -->                
                        <TextBlock
                            Grid.Column="0"
                            Grid.ColumnSpan="3"
                            Grid.Row="0"
                            Text="{Binding Name}"
                            HorizontalAlignment="Center"
                            VerticalAlignment="Center"
                            />


                    <!-- Displays the node's input connectors. -->                
                        <ItemsControl
                            Grid.Column="0"
                            Grid.Row="2"
                            ItemsSource="{Binding InputConnectors}"
                            ItemTemplate="{StaticResource inputConnectorTemplate}"
                            Focusable="False"
                            />

                        <!-- Displays the node's output connectors. -->
                        <ItemsControl
                            Grid.Column="2"
                            Grid.Row="2"
                            ItemsSource="{Binding OutputConnectors}"
                            ItemTemplate="{StaticResource outputConnectorTemplate}"
                            Focusable="False"
                            />                 

        </DataTemplate>

As you can see, inside the node there are inputConnectors and outputConnectors (for which I have properties for them in the ViewModel).

I'm trying to bind the node fill to this scenario:

If the node does not have input connectors OR output connectors I want the fill color to be different than if there are connectors.

How can I achieve this?

Upvotes: 0

Views: 355

Answers (2)

Danny Varod
Danny Varod

Reputation: 18118

You can define a view model with the properties InputConnectors, OutputConnectors, HasConnectors where HasConnectors is a calculated property from the other two.

Wire up the events on InputConnectors change and OutputConnectors CollectionChanged (and possibly PropertyChanged too - if the entire collection can change and not just its content) in the view model so that when the CollectionChanged event is fired the view model handles the event by firing a PropertyChanged event for HasConnectors.

In your view, bind the brush to HasConnectors using a 1:1 value converter from boolean to brush e.g. if true then green else red. You can leave the convert back unimplemented (returning Binding.DoNothing).

Upvotes: 1

user2250152
user2250152

Reputation: 20823

Try to use triggers. You can apply datatrigger on your datatemplate or grid and check if itemscontrols have any items and set fill color.

Upvotes: 0

Related Questions