How to use VisualStateManager instead of DataTrigger to implement dynamic binding?

I tried to implement a DataTrigger to do dynamic binding, based on which the toggle button switches to view. But after searching for this DataTrigger problem in WinRT? this seems to be unavailable in Windows Universal applications, and VisualStateManager should be used instead.

My question is: how can I implement the equivalent of the code below using VisualStateManager? Or any other alternative for setting dynamic binding from properties in the code behind the View Model.

This is the XAML that I intended to use until I came across this problem, where is the default binding OrdinaryGradePointKV, and when the toggle button switches, the binding changes to HigherGradePointKV:

<ComboBox
     Grid.Row="1"
     Grid.Column="0"
     Grid.ColumnSpan="2"
     Width="60"
     HorizontalAlignment="Right"
     DisplayMemberPath="Key">
     <ComboBox.Style>
         <Style>
             <Setter Property="ComboBox.ItemsSource" Value="{Binding OrdinaryGradePointKV}"></Setter>
             <Style.Triggers>
                 <DataTrigger Binding="{Binding IsHigherToggled}" Value="True">
                     <Setter Property="ComboBox.ItemsSource"
                         Value="{Binding HigherGradePointKV}" />
                 </DataTrigger>
             </Style.Triggers>
         </Style>
     </ComboBox.Style>
 </ComboBox>

The truncated version of the virtual machine is as follows, showing the properties associated with it:

namespace LC_Points.ViewModel
{

    public class MainViewModel : ViewModelBase
    {

        /// <summary>
        /// Initializes a new instance of the MainViewModel class.
        /// </summary>
        public MainViewModel()
        {
            //call methods to initialize list data
            GetSubjectTypes();
            GetOrdinaryGradePairs();
            GetHigherGradePairs();
        }


        public List<Score> Subjects { get; set; }
        public List<StringKeyValue> HigherGradePointKV { get; set; }
        public List<StringKeyValue> OrdinaryGradePointKV { get; set; }


        //ordinary toggle button bool
        private bool _isOrdinaryToggled;
        public bool IsOrdinaryToggled
        {
            get
            {
                return _isOrdinaryToggled;
            }
            set
            {
                _isOrdinaryToggled = value;
                RaisePropertyChanged("IsOrdinaryToggled");
            }
        }

        //Higher toggle button bool property
        private bool _isHigherToggled;
        public bool IsHigherToggled
        {
            get
            {
                return _isHigherToggled;
            }
            set
            {
                _isHigherToggled = value;
                RaisePropertyChanged("IsHigherToggled");
            }
        }




        public class StringKeyValue
        {
            public string Key { get; set; }
            public int Value { get; set; }
        }


        public void GetOrdinaryGradePairs()
        {

            List<StringKeyValue> ordianryGradePointKVTemp = new List<StringKeyValue>();


            ordianryGradePointKVTemp.Add(new StringKeyValue { Key = "A1", Value = 60 });
            ordianryGradePointKVTemp.Add(new StringKeyValue { Key = "A2", Value = 50 });
            ordianryGradePointKVTemp.Add(new StringKeyValue { Key = "B1", Value = 45 });
            ordianryGradePointKVTemp.Add(new StringKeyValue { Key = "B2", Value = 40 });
            ordianryGradePointKVTemp.Add(new StringKeyValue { Key = "B3", Value = 35 });
            ordianryGradePointKVTemp.Add(new StringKeyValue { Key = "C1", Value = 30 });
            ordianryGradePointKVTemp.Add(new StringKeyValue { Key = "C2", Value = 25 });
            ordianryGradePointKVTemp.Add(new StringKeyValue { Key = "C3", Value = 20 });
            ordianryGradePointKVTemp.Add(new StringKeyValue { Key = "D1", Value = 15 });
            ordianryGradePointKVTemp.Add(new StringKeyValue { Key = "D2", Value = 10 });
            ordianryGradePointKVTemp.Add(new StringKeyValue { Key = "D3", Value = 5 });
            ordianryGradePointKVTemp.Add(new StringKeyValue { Key = "E,F,NG", Value = 0 });
            ordianryGradePointKVTemp.Add(new StringKeyValue { Key = "Pass", Value = 30 });
            ordianryGradePointKVTemp.Add(new StringKeyValue { Key = "Merit", Value = 50 });
            ordianryGradePointKVTemp.Add(new StringKeyValue { Key = "Distinction", Value = 70 });


            OrdinaryGradePointKV = ordianryGradePointKVTemp;

        }


        public void GetHigherGradePairs()
        {

            List<StringKeyValue> higherGradePointKVTemp = new List<StringKeyValue>();


            higherGradePointKVTemp.Add(new StringKeyValue { Key = "A1", Value = 100 });
            higherGradePointKVTemp.Add(new StringKeyValue { Key = "A2", Value = 90 });
            higherGradePointKVTemp.Add(new StringKeyValue { Key = "B1", Value = 85 });
            higherGradePointKVTemp.Add(new StringKeyValue { Key = "B2", Value = 80 });
            higherGradePointKVTemp.Add(new StringKeyValue { Key = "B3", Value = 75 });
            higherGradePointKVTemp.Add(new StringKeyValue { Key = "C1", Value = 70 });
            higherGradePointKVTemp.Add(new StringKeyValue { Key = "C2", Value = 65 });
            higherGradePointKVTemp.Add(new StringKeyValue { Key = "C3", Value = 60 });
            higherGradePointKVTemp.Add(new StringKeyValue { Key = "D1", Value = 55 });
            higherGradePointKVTemp.Add(new StringKeyValue { Key = "D2", Value = 50 });
            higherGradePointKVTemp.Add(new StringKeyValue { Key = "D3", Value = 45 });
            higherGradePointKVTemp.Add(new StringKeyValue { Key = "E,F,NG", Value = 0 });
            higherGradePointKVTemp.Add(new StringKeyValue { Key = "Pass", Value = 30 });
            higherGradePointKVTemp.Add(new StringKeyValue { Key = "Merit", Value = 50 });
            higherGradePointKVTemp.Add(new StringKeyValue { Key = "Distinction", Value = 70 });


            HigherGradePointKV = higherGradePointKVTemp;
        }



        public void GetSubjectTypes()
        {
            List<Score> subjectList = new List<Score>();

            // Adding Subjects to List
            subjectList.Add(new Score { Subject = "Biology" });
            subjectList.Add(new Score { Subject = "Business" });
            subjectList.Add(new Score { Subject = "Business Group" });
            subjectList.Add(new Score { Subject = "Chemistry" });
            subjectList.Add(new Score { Subject = "Classical Studies" });

            Subjects = subjectList;

        }

    }
}
+4
source share
1 answer

If you want to use DataTriggers, you can use DataTriggerBehavior from the Microsoft.Xaml.Interactions.Core namespace. The easiest way to add behavior is to open the project in Blend and add it from the asset panel. Blend will automatically add a reference to the BehaviorsXamlSDKManaged project in the project.

<ComboBox>
    <Interactivity:Interaction.Behaviors>
        <Core:DataTriggerBehavior Value="True" Binding="{Binding IsChecked, ElementName=toggleButton}">
            <Core:ChangePropertyAction PropertyName="ItemsSource" Value="{Binding OrdinaryGradePointKV}"/>
        </Core:DataTriggerBehavior>
        <Core:DataTriggerBehavior Value="False" Binding="{Binding IsChecked, ElementName=toggleButton}">
            <Core:ChangePropertyAction PropertyName="ItemsSource" Value="{Binding HighGradePointKV}"/>
        </Core:DataTriggerBehavior>
    </Interactivity:Interaction.Behaviors>
</ComboBox>

, , , .

, , ComboBox ItemsSource. , , VisualStateGroup :

<VisualStateGroup x:Name="GradePointStates">
    <VisualState x:Name="Higher">
        <Storyboard>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(ItemsControl.ItemsSource)" Storyboard.TargetName="comboBox">
                <DiscreteObjectKeyFrame KeyTime="0" Value="{Binding HigherGradePointKV}" />
            </ObjectAnimationUsingKeyFrames>
        </Storyboard>
    </VisualState>
    <VisualState x:Name="Ordinary">
    </VisualState>
</VisualStateGroup>

VisualState , GoToStateAction:

<ToggleButton Content="ToggleButton">
    <Interactivity:Interaction.Behaviors>
        <Core:EventTriggerBehavior EventName="Checked">
            <Core:GoToStateAction StateName="Higher"/>
        </Core:EventTriggerBehavior>
        <Core:EventTriggerBehavior EventName="Unchecked">
            <Core:GoToStateAction StateName="Ordinary"/>
        </Core:EventTriggerBehavior>
    </Interactivity:Interaction.Behaviors>
</ToggleButton>
+7

All Articles