Question

我们正在使用C#在Visual Studio 2017，Xamarin开发iOS购物车应用程序。我们正在使用其他网络服务，但我在Data Bindings：

时遇到了一些问题

如何在选项卡页面中绑定内容页面（选项卡页面的子项）标题以及列表视图？

现在标签页工作正常，但listview无效，请求您帮助我们解决此问题，我们正在粘贴以下代码

TabbedPage1.xaml.cs

namespace SalesRep.SalesOrderPages
{
    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class TabbedPage1 : TabbedPage
    {
        ObservableCollection<Class1> Filter = new ObservableCollection<Class1>();
        public TabbedPage1()
        {
            InitializeComponent();
        }

        protected async override void OnAppearing()
        {
            base.OnAppearing();

            var lst = await App.TodoManager.GetItemTasksAsync("all");//this is catalog list from rest | var MyTabTitle = await App.TodoManager.GetEmployeeTasksAsync("Roudy");//this is Salerep Employee list from rest
            var myArray = MyTabTitle.ToArray<Employee>();
            var arraycount = MyTabTitle.Count;
            int arraypos = 0;
            RootObject2 rs = new RootObject2();

            foreach (var i in lst)
            {
                var hai = JsonConvert.SerializeObject(i);
                var myitem = JsonConvert.DeserializeObject<RootObject2>(hai);
                var lst1 = new Class1 // Here i have created Class1 which i display tab title and cataloge item
                {
                    FilterName=myArray[arraypos].FilterName,
                    Items= myitem.Catalog                  
                };

                if (arraypos < arraycount -1)
                    arraypos = arraypos + 1;
                else
                    break;

                Filter.Add(lst1);
            }
            ItemsSource = Filter;
        }
    }
}

TabbedPage1.xaml

<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
            xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
            x:Class="SalesRep.SalesOrderPages.TabbedPage1"
            x:Name="MyTab" >        
    <TabbedPage.ItemTemplate>
        <DataTemplate>
            <ContentPage Title="{Binding FilterName}">
                <StackLayout>
                    <ListView x:Name="MyListView" 
                              ItemsSource="{Binding Items}">                        
                        <ListView.ItemTemplate>
                            <DataTemplate>
                                <ViewCell>
                                    <Label Text="{Binding Name}"
                                           FontSize="15" 
                                           TextColor="Black" />
                                    <Label Text="{Binding Price, StringFormat='{0:N}'}"  
                                           FontSize="15" 
                                           TextColor="Black" />
                                    <Label Text="{Binding Pack}"
                                           FontSize="15" 
                                           TextColor="Black" />
                                    <Label Text="{Binding UnitPrice}" 
                                           WidthRequest="120"  
                                           FontSize="15" 
                                           TextColor="Black" />
                                </ViewCell>
                            </DataTemplate>
                        </ListView.ItemTemplate>
                    </ListView>
                </StackLayout>
            </ContentPage>
        </DataTemplate>
    </TabbedPage.ItemTemplate>
</TabbedPage>

用于在rest api

中显示动态标签页的员工类

public class Employee
{
    public string EmployeeId { get; set; }
    public string FilterName { get; set; }
    public string FilterCriteria { get; set; }
}

目录类

namespace SalesRep.Models
{
    public class Catalogcls: INotifyPropertyChanged
    {        
        public string Type { get; set; }
        public string Image { get; set; }
        public string Name { get; set; }
        public string UnitPrice { get; set; }
        public double Price { get; set; }
        public string Pack { get; set; }
    }

    public class RootObject2
    {
        public ObservableCollection<Catalogcls> Catalog { get; set; }
    }
}

第1课

namespace SalesRep.Models
{
    public class Class1
    {
        public string FilterName { get; set; }
        public ObservableCollection<Catalogcls> Items { get; set; }
    }
}

Answer 1

好问题。 Xamarin中的数据绑定可能会令人困惑。首先，您实施标签页的方式是错误的。选项卡式页面的工作方式是创建一个根选项卡页面，您可以在其中设置子页面。这些子页面应该是内容页面，而不是选项卡页面。

以下是此示例的实现。请注意，标题为MyStyle，MyCuts和NewCut的页面都是内容页面。唯一的选项卡页面是根选项卡页面，其中不包含任何视图，只包含包含视图的子页面。

  public RootTabLayout()
  {      
        InitializeComponent();

        // TABS \\
        myCuts = new MyCuts() // ContentPage
        {
            Icon = "cut.png",
            Title = "My Cuts",
        };
        newCut = new NewCut(RootCutCamera) // ContentPage
        {
            Icon = "camera.png",
            Title = "Creator"
        };
        myStyle = new MyStyle(UserDb, RootCutCamera) // ContentPage
        {
            Icon = "bowtie.png",
            Title = "My Style"
        };
        Children.Add(MyCuts);
        Children.Add(NewCut);
        Children.Add(MyStyle);
  }

至于绑定方面，您的实际绑定代码没有问题。您只需添加bindingcontext，以便您的视图知道要绑定的内容。您需要为ContentPage设置BindingContext。这将自动为所有页面子项设置绑定上下文，如果您需要针对不同项目的不同绑定上下文，则可以为每个视图单独设置它们。

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         xmlns:local="clr-namespace:XamarinPOC.ViewModel,assembly=YourApp.ReplaceWithLocalNamespace"
         x:Class="YourApp.ContentPage1"
         Title="Summary List"    
         BindingContext="YourApp.SalesRep.Models" // set binding context of the content page>

有关DataBinding的更多信息： Set BindingContext to ViewModel in XAML on Xamarin.Forms

https://docs.microsoft.com/en-us/xamarin/xamarin-forms/xaml/xaml-basics/data-binding-basics

如何在选项卡页面中绑定内容页面标题和列表视图

1 个答案: