在ListView

时间:2016-08-02 16:33:46

标签: c# xamarin xamarin.forms material-design

我是移动开发者和Xamarin的新手,所以请原谅我,如果这有些基本但是我一直在谷歌搜索我的脑子并且找不到这个的好答案...

我设置了一个MasterDetail页面,其中我的应用程序的主要导航方案为主,并且详细信息页面通过反射加载到主文件中绑定到我的ListView的对象的TargetType属性。基本上直接来自MasterDetail页面的Xamarin样本如下:

    public class MasterPageItem
    {
        public string Title { get; set; }
        public string IconSource { get; set; }
        public Type TargetType { get; set; }
    }

    public MainMenu ()
    {
        InitializeComponent ();

        var masterPageItems = new List<MasterPageItem>();
        masterPageItems.Add(new MasterPageItem
        {
            Title = "Events",
            IconSource = "Icon.png",
            TargetType = typeof(MainPage)
        });
        masterPageItems.Add(new MasterPageItem
        {
            Title = "Categories",
            IconSource = "Icon.png",
            TargetType = typeof(Categories)
        });
        masterPageItems.Add(new MasterPageItem
        {
            Title = "Tags",
            IconSource = "Icon.png",
            TargetType = typeof(Tags)
        });

        listView.ItemsSource = masterPageItems;
    }

    void OnItemSelected(object sender, SelectedItemChangedEventArgs e)
        {
            var item = e.SelectedItem as MasterPageItem;
            if (item != null)
            {
                listView.SelectedItem = null;

                var mdPage = this.Parent as MasterDetail;
                mdPage.IsPresented = false;

                mdPage.Detail = new NavigationPage((ContentPage)Activator.CreateInstance(item.TargetType))
                {
                    BarBackgroundColor = Color.FromHex("1976D2")
                };
            }
        }

Xaml Page:

<ContentPage.Content>
    <StackLayout VerticalOptions="FillAndExpand">
      <ListView x:Name="listView" VerticalOptions="FillAndExpand" SeparatorVisibility="None" ItemSelected="OnItemSelected">
        <ListView.ItemTemplate>
          <DataTemplate>
            <ImageCell ImageSource="{Binding IconSource}" Text="{Binding Title}" TextColor="White" Tapped="OnCellTapped" />
          </DataTemplate>
        </ListView.ItemTemplate>
      </ListView>
    </StackLayout>
  </ContentPage.Content>

我的目标是尝试在按ListView项目时添加简单的材质设计类型背景色动画(如下例所示:http://thecodeplayer.com/walkthrough/ripple-click-effect-google-material-design)。

看起来ImageCell类没有实现IAnimatable,因此绑定到该元素上的Tapped事件将无济于事,而ListView类本身似乎没有实现任何类型的Item或Row元素本身动画。我看到的唯一选择是为整个ListView设置动画,我实际上可以做到,但显然不是我想要实现的。

ListView本身似乎没有SelectedItemBackgroundColor属性或等效属性?我觉得我缺少一些重要的东西,比如这不能跨平台完成,而且必须是平台特定的,但这似乎是Xamarin.Forms中的主要疏忽,不是吗?

我还有一些其他的ListViews,我想使用类似的UX,所以任何帮助都会非常感激。

1 个答案:

答案 0 :(得分:0)

我刚试过这个,看起来在使用AppCompat时默认提供了涟漪效果。 MasterDetailPage示例尚未更新,这可能就是为什么它不能在那里工作。要将AppCompat和Material设计添加到Forms Android项目,请查看此guide