XAML语法之数据绑定及MVVM

1.数据绑定:即将两个对象绑定到一起,一个发生变化另一个也会改变

  数据绑定包括两部分:数据源和目标绑定属性,要求目标对象派生自BindableObject。数据绑定包括两个步骤:

1)BindingContext绑定数据源对象

2)Binding绑定数据源对象的相应属性

1.1View-View之间绑定

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="XamlSamples.SliderBindingsPage"
             Title="Slider Bindings Page">
    <StackLayout>
        <Label Text="ROTATION"
               BindingContext="{x:Reference Name=slider}" //“name=”可省略
               Rotation="{Binding Path=Value}"            //binding为第一项时“Path=”可省略
               FontAttributes="Bold"
               FontSize="Large"
               HorizontalOptions="Center"
               VerticalOptions="CenterAndExpand" />
        <Slider x:Name="slider"
                Maximum="360"
                VerticalOptions="CenterAndExpand" />
        <Label BindingContext="{x:Reference slider}"
               Text="{Binding Value, StringFormat='The angle is {0:F0} degrees'}"
               FontAttributes="Bold"
               FontSize="Large"
               HorizontalOptions="Center"
               VerticalOptions="CenterAndExpand" />
    </StackLayout>
</ContentPage>

1.2绑定模式

Default

OneWay 值从源属性输出到目标属性

OneWayToSource  值从目标属性输出到源属性

TwoWay  相互输出

<!-- Scaled and rotated Label -->
        <Label x:Name="label"
               Text="TEXT"
               HorizontalOptions="Center"
               VerticalOptions="CenterAndExpand" />

        <!-- Slider and identifying Label for Scale -->
        <Slider x:Name="scaleSlider"
                BindingContext="{x:Reference label}"
                Grid.Row="1" Grid.Column="0"
                Maximum="10"
                Value="{Binding Scale, Mode=TwoWay}" />

        <Label BindingContext="{x:Reference scaleSlider}"
               Text="{Binding Value, StringFormat='Scale = {0:F1}'}"
               Grid.Row="1" Grid.Column="1"
               VerticalTextAlignment="Center" />

        <!-- Slider and identifying Label for Rotation -->
        <Slider x:Name="rotationSlider"
                BindingContext="{x:Reference label}"
                Grid.Row="2" Grid.Column="0"
                Maximum="360"
                Value="{Binding Rotation, Mode=OneWayToSource}" />

1.3绑定到ListView

<ListView ItemsSource="{x:Static local:NamedColor.All}"> //ListView子项的数据源
    <ListView.ItemTemplate>  //子项模板
        <DataTemplate>
            <ViewCell>
                <ViewCell.View> //放置子项布局和控件
                    <Label Text="{Binding FriendlyName}" /> //绑定对象的FriendlyName属性
                </ViewCell.View>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

1.4值转换器(implement IValueConverter):

sample

namespace XamlSamples
{
    class DoubleToIntConverter : IValueConverter
    {
        public object Convert(object value, Type targetType,  //源转目标
                              object parameter, CultureInfo culture)
        {
            double multiplier;

            if (!Double.TryParse(parameter as string, out multiplier))
                multiplier = 1;

            return (int)Math.Round(multiplier * (double)value);
        }

        public object ConvertBack(object value, Type targetType,  //目标转源
                                  object parameter, CultureInfo culture)
        {
            double divider;

            if (!Double.TryParse(parameter as string, out divider))
                divider = 1;

            return ((double)(int)value) / divider;
        }
    }
}
<local:DoubleToIntConverter x:Key="intConverter" />
<Label Text="{Binding Color.R,     //Color.R~0-1
                      Converter={StaticResource intConverter},
                      ConverterParameter=255,
                      StringFormat='R={0:X2}'}" />

2.MVVM绑定:参考以下网址

http://www.cnblogs.com/GuZhenYin/p/7381973.html

sample(绑定系统类)

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:sys="clr-namespace:System;assembly=mscorlib"
             x:Class="XamlSamples.OneShotDateTimePage"
             Title="One-Shot DateTime Page">

    <StackLayout BindingContext="{x:Static sys:DateTime.Now}"
                 HorizontalOptions="Center"
                 VerticalOptions="Center">

        <Label Text="{Binding Year, StringFormat='The year is {0}'}" />
        <Label Text="{Binding StringFormat='The month is {0:MMMM}'}" />
        <Label Text="{Binding Day, StringFormat='The day is {0}'}" />
        <Label Text="{Binding StringFormat='The time is {0:T}'}" />

    </StackLayout>
</ContentPage>



猜你喜欢

转载自blog.csdn.net/qq_33606368/article/details/80857339
今日推荐