H.A.H.
H.A.H.

Reputation: 3887

Pass the VisualState of CollectionView Item VisualElement to its child VisualElements

I am having the following situation:

CollectionView, each item is Border, that contains other controls. When selected, the VisualState of the Border changes to selected. The child controls however do not have a change in their state.

Is there an easy way to link/pass those VisualStates to all child controls? (cascade, 2,3,4 and more levels deeper)

Edit: I know how to use Triggers, Setters in Styles and other approaches to change the UI of the application. The question is specifically for changing the VisualState of the nested VisualElements. Cannot find anything anywhere on this matter.

Upvotes: 3

Views: 1379

Answers (1)

Jessie Zhang -MSFT
Jessie Zhang -MSFT

Reputation: 13803

You can try to set state on multiple elements.

Visual states could be attached to and operated on single elements. And it's also possible to create visual states that are attached to a single element, but that set properties on other elements within the same scope. This avoids having to repeat visual states on each element the states operate on.

The following example shows how to set state on multiple objects, from a single visual state group:

<StackLayout>
    <Label Text="What is the capital of France?" />
    <Entry x:Name="entry"
           Placeholder="Enter answer" />
    <Button Text="Reveal answer">
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="CommonStates">
                <VisualState x:Name="Normal" />
                <VisualState x:Name="Pressed">
                    <VisualState.Setters>
                        <Setter Property="Scale"
                                Value="0.8" />
                        <Setter TargetName="entry"
                                Property="Entry.Text"
                                Value="Paris" />
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
    </Button>
</StackLayout>

Note: Property paths are unsupported in Setter elements that specify the TargetName property.

You can also try to define custom visual states, for more information, you can check: Define custom visual states .

Upvotes: 0

Related Questions