久等了，今天讲Xamarin.Forms里的核心——数据绑定，是将数据绑定到对应的view上，实现cs文件与XML文件的数据流通。今天普通的数据绑定我不做讲解，今天只讲个最复杂的，就是将接口解析的数据为模型数组，再将模型数组映射到对应的ListView上。下面就来逐一讲解。

1、新建数据模型##

根据接口的数据返回值新建对应的模型。

    public class JFCustomers
    {
        [JsonProperty("list")]
        public IEnumerable<JFCustomer> Items { get; set; }
    }

    public class JFCustomer
    {
        [JsonProperty("address")]
        public string address { get; set; }

        [JsonProperty("customerType")]
        public string customerType { get; set; }

        [JsonProperty("customerTypeView")]
        public string customerTypeView { get; set; }

        [JsonProperty("id")]
        public string id { get; set; }

        [JsonProperty("investProductCount")]
        public string investProductCount { get; set; }

        [JsonProperty("investShareAmountTotal")]
        public string investShareAmountTotal { get; set; }

        [JsonProperty("investShareTotal")]
        public string investShareTotal { get; set; }

        [JsonProperty("mobile")]
        public string mobile { get; set; }

        [JsonProperty("name")]
        public string name { get; set; }

    }

2、调接口，获取数据##

这里网络使用的是httpclient，请不要使用request，因为request里有些方法已经不再使用。

    protected override async void OnAppearing()
    {
        base.OnAppearing();
        int currentPage = 1;
        String sequenceName = "investShareAmountTotal";
        String uri = JFGobalData.baseUrl + "/api/fund/clients?keyWords=" + searchBar.Text + "&page=" + currentPage + "&pageSize=10&sort=" + sequenceName;
        HttpClient client = new HttpClient();
        client.DefaultRequestHeaders.Add("X-Auth-Token",urlToken);
        var task = await client.GetAsync(uri);
        var jsonString = await task.Content.ReadAsStringAsync();
        var converted = JsonConvert.DeserializeObject<JFCustomers>(jsonString);
        customerListView.ItemsSource = converted.Items;
    }

这里是在界面刚开始加载时调用接口，我们只需要看最后两行代码

var converted = JsonConvert.DeserializeObject<JFCustomers>(jsonString);
customerListView.ItemsSource = converted.Items;

第一行是将json解析成模型数组，第二行是将模型数组给ListView的ItemsSource，这样我们就完成了宏观的数据绑定，我们还需要将模型里的各个数据放到对应的view里展示。

3、模型属性分发给View##

这里才是最后的重中之重，我们还是看代码来分析

<ListView x:Name = "customerListView"
                    SeparatorVisibility = "None"
                        ItemSelected = "customerListViewItemSelected">
                <ListView.RowHeight>
                     <OnPlatform x:TypeArguments="x:Int32"
                                iOS="80"
                                Android="80"
                                WinPhone="90" />
                </ListView.RowHeight>

                <ListView.ItemTemplate>
                    <DataTemplate>
                        <ViewCell>
                            <ContentView>
                                <Frame OutlineColor = "Accent"
                                        Padding = "5">
                                    <StackLayout Orientation = "Vertical">
                                            <Label Text = "{Binding name}"
                                                FontSize = "18"
                                                TextColor = "Black"
                                                HorizontalOptions = "StartAndExpand"/>

                                        <StackLayout Orientation = "Horizontal">
                                            <Label Text = "客户类别"
                                                FontSize = "12"
                                                TextColor = "Gray"
                                                HorizontalOptions = "StartAndExpand"/>

                                            <Label Text = "{Binding customerType}"
                                                FontSize = "12"
                                                TextColor = "Black"
                                                HorizontalOptions = "StartAndExpand"/>

                                            <Label Text = "投资产品(个)"
                                                FontSize = "12"
                                                TextColor = "Gray"
                                                HorizontalOptions = "StartAndExpand"/>
                                            <Label Text = "{Binding investProductCount}"
                                                FontSize = "12"
                                                TextColor = "Black"
                                                HorizontalOptions = "StartAndExpand"/>
                                        </StackLayout>

                                        <StackLayout Orientation = "Horizontal">
                                            <Label Text = "投资份额(份)"
                                                FontSize = "12"
                                                TextColor = "Gray"
                                                HorizontalOptions = "StartAndExpand"/>

                                            <Label Text = "{Binding investShareTotal}"
                                                FontSize = "12"
                                                TextColor = "Black"
                                                HorizontalOptions = "StartAndExpand"/>

                                            <Label Text = "投资金额(元)"
                                                FontSize = "12"
                                                TextColor = "Gray"
                                                HorizontalOptions = "StartAndExpand"/>
                                            <Label Text = "{Binding investShareAmountTotal}"
                                                FontSize = "12"
                                                TextColor = "Black"
                                                HorizontalOptions = "StartAndExpand"/>
                                        </StackLayout>
                                    </StackLayout>
                                </Frame>
                            </ContentView>
                        </ViewCell>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>

其实这里真没有什么可说而
我只说一点

ItemSelected = "customerListViewItemSelected"

这个用来给每一行元素提供点击事件，或许你会问，我怎么知道我点击的是哪一行，下面就给你解答。

4、获取点击的模型##

void customerListViewItemSelected(object sender, SelectedItemChangedEventArgs e)
{
    JFCustomerDetailPage customerDetailPage = new JFCustomerDetailPage();
    customerDetailPage.customerModel = (JFCustomer)e.SelectedItem;
    this.Navigation.PushAsync(customerDetailPage);
}

这样你就可以拿到你所点击那一行。

结语#

本人才疏学浅，如有描述不对的地方望大神指正。还有Xamarin目前似乎不在维护，请小心跳坑，个人认为拿来做小应用是可以的，大型应用最好还是寻找别的解决方案。谢谢