使用触发器

时间:2017-07-26 13:47:06

标签: wpf xaml mvvm wpf-controls bing-maps

我正在尝试使用DataTemplate触发器更改XAML地图图钉的背景颜色,但我的代码可能有问题。我们的想法是,地图的ItemSource绑定到PushpinModel的ObservableCollection,当属性IsOnline的值为true时,图钉应该变为绿色。

这是我的Geolocation.xaml

<m:Map CredentialsProvider="XXX" Mode="Road">
    <m:MapItemsControl Name="Pushpins" ItemsSource="{Binding PushpinCollection}" >
        <m:MapItemsControl.ItemTemplate>
            <DataTemplate>
                <m:Pushpin Location="{Binding Path=Location}" />
                <DataTemplate.Triggers>
                    <DataTrigger Binding="{Binding Path=IsOnline}" Value="True">
                        <Setter Property="m:Pushpin.Background" Value="Green"></Setter>
                    </DataTrigger>
                </DataTemplate.Triggers>
            </DataTemplate>
        </m:MapItemsControl.ItemTemplate>
    </m:MapItemsControl>
</m:Map>

这是视图模型GeolocationViewModel.cs

namespace MyNamespace
{
    internal class Pushpins : ObservableCollection<PushpinModel> { }

    internal class PushpinModel
    {
        public PushpinModel(double latitude, double longitude)
        {
            Location = new Location(latitude, longitude);
        }
        public Location Location { get; set; }
        public bool IsOnline { get; set; } = false;
    }

    internal class GeolocationViewModel : INotifyPropertyChanged
    {
        public GeolocationViewModel()
        {
            pushpinCollection = new Pushpins();
             CreatePushpins();
        }

        private Pushpins pushpinCollection;
        public Pushpins PushpinCollection
        {
            get { return pushpinCollection;  }
        }

        private void CreatePushpins()
        {
            Random rnd = new Random();

            for (int i = 1; i <= 100; i++)
            {
                PushpinModel pin = new PushpinModel(rnd.NextDouble() * 180 - 90, rnd.NextDouble() * 360 - 180);

                if (rnd.NextDouble() >= 0.5)
                    pin.IsOnline = true;

                pushpinCollection.Add(pin);
            }
            OnPropertyChanged("PushpinCollection");
        }

        #region IPropertyChange
        public event PropertyChangedEventHandler PropertyChanged;

        protected void OnPropertyChanged(string propertyName)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
        #endregion
    }
}

我对Property Setter有疑问,因为我认为我没有更改正确的项目。

有什么建议吗?谢谢你们!

1 个答案:

答案 0 :(得分:0)

最后,我找到了一种使用Style.Triggers更改图钉颜色的方法。 这是工作Geolocation.xaml

<m:Map CredentialsProvider="XXX" Mode="Road">
    <m:MapItemsControl Name="Pushpins" ItemsSource="{Binding PushpinCollection}" >
        <m:MapItemsControl.ItemTemplate>
            <DataTemplate>
                <m:Pushpin Location="{Binding Path=Location}" />
                 <m:Pushpin.Style>
                    <Style TargetType="m:Pushpin">
                         <Setter Property="Background" Value="Red" />
                         <Style.Triggers>
                             <DataTrigger Binding="{Binding IsOnline}" Value="True">
                                 <Setter Property="Background" Value="Green" />
                             </DataTrigger>
                         </Style.Triggers>
                    </Style>
                <m:Pushpin.Style>
            </DataTemplate>
        </m:MapItemsControl.ItemTemplate>
    </m:MapItemsControl>
</m:Map>

以及GeolocationViewModel.cs的工作版本:

namespace MyNamespace
{
    internal class Pushpins : ObservableCollection<Pushpin> { }

    internal class Pushpin : INotifyPropertyChanged
    {
        public Pushpin(double latitude, double longitude)
        {
            Location = new Location(latitude, longitude);
            IsOnline = false;
        }
        public Location Location { get; set; }

        private bool isOnline;
        public bool IsOnline
        { 
            get { return isOnline; }
            set
            {
                isOnline = value;
                OnPropertyChanged("IsOnline");
            }
        }

        #region IPropertyChange
        public event PropertyChangedEventHandler PropertyChanged;

        protected void OnPropertyChanged(string propertyName)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
        #endregion
    }

    internal class GeolocationViewModel : INotifyPropertyChanged
    {
        public GeolocationViewModel()
        {
            pushpinCollection = new Pushpins();
            CreateRandomPushpins();
        }

        private Pushpins pushpinCollection;
        public Pushpins PushpinCollection
        {
            get { return pushpinCollection;  }
        }

        private void CreateRandomPushpins()
        {
            Random rnd = new Random();

            for (int i = 1; i <= 100; i++)
            {
                PushpinModel pin = new PushpinModel(rnd.NextDouble() * 180 - 90, rnd.NextDouble() * 360 - 180);

                if (rnd.NextDouble() >= 0.5)
                    pin.IsOnline = true;

                pushpinCollection.Add(pin);
            }
            OnPropertyChanged("PushpinCollection");
        }

        #region IPropertyChange
        public event PropertyChangedEventHandler PropertyChanged;

        protected void OnPropertyChanged(string propertyName)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
        #endregion
    }
}