使用MVVM模式XAML的Bing Map折线

时间:2016-11-16 09:56:44

标签: xaml mvvm windows-phone-8.1 here-api

我正在研究基于widows phone 8.1地图的应用程序。我想知道如何使用MVVM模式绘制地图折线。我已经使用后面的代码实现了这一点,首先创建折线然后添加它。我的问题是我可以在XAML中定义一条折线,并为我的viewmodel中的一个我的可观察的类型BasicGeopositions集合提供源代码绑定。如果是,那么如何?

使用折线绘制的数据:

是BasicGeoposition的列表,其中包含我需要连接的所有点的纬度和经度。我试过这种方式<Maps:MapPolyline Path="{Binding Trip.PTSPositions}"/>,但它没有用。 PTSPositions是BasicGeoposition的列表。

我想要执行的任务:

我想

MapPolyline polyLine = new MapPolyline() { StrokeColor = Colors.Blue, StrokeThickness = 5 };
        polyLine.Path = new Geopath(Trip.PTSPositions);
        MyMap.MapElements.Add(polyLine);

使用MVVM在XAML中执行上面的代码,其中Trip.PTSPositions将动态获取,地图折线将使用数据绑定绘制。 我在网上搜索了很多。我无法找到任何不使用折线后面的代码的东西

1 个答案:

答案 0 :(得分:1)

以下是评论中建议的实施。

这是MapControl附加的可绑定属性实现,它保留在Widows Phone 8.1项目中:

public class Polyline
{
    public static readonly DependencyProperty PathProperty =
        DependencyProperty.RegisterAttached(
            "Path",
            typeof(IBasicGeoposition[]),
            typeof(Polyline),
            new PropertyMetadata(null, OnPathChanged));

    public static void SetPath(UIElement element, IBasicGeoposition[] value)
    {
        element.SetValue(PathProperty, value);
    }

    public static IBasicGeoposition[] GetPath(UIElement element)
    {
        return (IBasicGeoposition[]) element.GetValue(PathProperty);
    }

    private static void OnPathChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
        var mapControl = d as MapControl;
        if (mapControl == null)
        {
            throw new InvalidOperationException(
                "Polyline.Track property can only be attached to a MapControl!");
        }

        mapControl.MapElements.Clear();

        mapControl.MapElements.Add(CreateMapPolyline(GetPath(mapControl)));
    }

    private static MapPolyline CreateMapPolyline(IEnumerable<IBasicGeoposition> track)
    {
        return new MapPolyline
        {
            Path = new Geopath(track.Select(x =>
                new BasicGeoposition
                {
                    Altitude = x.Altitude,
                    Latitude = x.Latitude,
                    Longitude = x.Longitude,
                })),
            StrokeColor = Colors.Red,
            StrokeThickness = 3,
            StrokeDashed = false
        };
    }
}

此接口保留在PCL中,可能接近它的实现(您必须添加实现接口的自定义类):

public interface IBasicGeoposition
{
    double Altitude { get; set; }
    double Latitude { get; set; }
    double Longitude { get; set; }
}

在视图模型中,您拥有Trip.PTSPositions数组IBasicGeoposition。在视图(XAML)中,您将拥有:

<maps:MapControl attached:Polyline.Path="{Binding Trip.PTSPositions}"/>