水平列表視圖Xamarin表格

Question

我想在Xamarin表單中實現水平滾動列表視圖，並且我嘗試了幾個庫，但找不到好的解決方案。這是可能的Xamrin形式（沒有呈現），並有工作庫我可以使用？

Answer 1

嘗試https://www.nuget.org/packages/HorizontalListView1.1/

使用範例：（XAML）

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
x:Class="test.ListPage" xmlns:Controls="clr-namespace:test;assembly=test"> 

<Controls:HorizontalListView ItemsSource="{Binding Categories}" ListOrientation="Horizontal"> 
    <Controls:HorizontalListView.ItemTemplate> 
    <DataTemplate> 
    <Label Text="{Binding Name}" Grid.Row="0" YAlign="Center" /> 
    </DataTemplate> 
    </Controls:HorizontalListView.ItemTemplate> 
    </Controls:myControl> 

Answer 2

中序，讓你必須創建一個自定義的滾動型水平滾動列表視圖的注意和XAML

使用這種自定義控件

public class ImageGallery：ScrollView { readonly StackLayout _imageStack;

public ImageGallery() 
    { 
     this.Orientation = ScrollOrientation.Horizontal; 

     _imageStack = new StackLayout 
     { 
      Orientation = StackOrientation.Horizontal 
     }; 

     this.Content = _imageStack; 
    } 

    public IList<View> Children 
    { 
     get 
     { 
      return _imageStack.Children; 
     } 
    } 


    public static readonly BindableProperty ItemsSourceProperty = 
     BindableProperty.Create<ImageGallery, IList>(
      view => view.ItemsSource, 
      default(IList), 
      BindingMode.TwoWay, 
      propertyChanging: (bindableObject, oldValue, newValue) => { 
       ((ImageGallery)bindableObject).ItemsSourceChanging(); 
      }, 
      propertyChanged: (bindableObject, oldValue, newValue) => { 
       ((ImageGallery)bindableObject).ItemsSourceChanged(bindableObject, oldValue, newValue); 
      } 
     ); 

    public IList ItemsSource 
    { 
     get 
     { 
      return (IList)GetValue(ItemsSourceProperty); 
     } 
     set 
     { 

      SetValue(ItemsSourceProperty, value); 
     } 
    } 
    void ItemsSourceChanging() 
    { 
     if (ItemsSource == null) 
      return; 
    } 
    void ItemsSourceChanged(BindableObject bindable, IList oldValue, IList newValue) 
    { 
     if (ItemsSource == null) 
      return; 

     var notifyCollection = newValue as INotifyCollectionChanged; 
     if (notifyCollection != null) 
     { 
      notifyCollection.CollectionChanged += (sender, args) => { 
       if (args.NewItems != null) 
       { 
        foreach (var newItem in args.NewItems) 
        { 

         var view = (View)ItemTemplate.CreateContent(); 
         var bindableObject = view as BindableObject; 
         if (bindableObject != null) 
          bindableObject.BindingContext = newItem; 
         _imageStack.Children.Add(view); 
        } 
       } 
       if (args.OldItems != null) 
       { 
        // not supported 
        _imageStack.Children.RemoveAt(args.OldStartingIndex); 
       } 
      }; 
     } 
    } 
    public DataTemplate ItemTemplate 
    { 
     get; 
     set; 
    } 
    public static readonly BindableProperty SelectedItemProperty = 
     BindableProperty.Create<ImageGallery, object>(
      view => view.SelectedItem, 
      null, 
      BindingMode.TwoWay, 
      propertyChanged: (bindable, oldValue, newValue) => { 
       ((ImageGallery)bindable).UpdateSelectedIndex(); 
      } 
     ); 

    public object SelectedItem 
    { 
     get 
     { 
      return GetValue(SelectedItemProperty); 
     } 
     set 
     { 
      SetValue(SelectedItemProperty, value); 
     } 
    } 

    void UpdateSelectedIndex() 
    { 
     if (SelectedItem == BindingContext) 
      return; 

     SelectedIndex = Children 
      .Select(c => c.BindingContext) 
      .ToList() 
      .IndexOf(SelectedItem); 

    } 

    public static readonly BindableProperty SelectedIndexProperty = 
     BindableProperty.Create<ImageGallery, int>(
      carousel => carousel.SelectedIndex, 
      0, 
      BindingMode.TwoWay, 
      propertyChanged: (bindable, oldValue, newValue) => { 
       ((ImageGallery)bindable).UpdateSelectedItem(); 
      } 
     ); 

    public int SelectedIndex 
    { 
     get 
     { 
      return (int)GetValue(SelectedIndexProperty); 
     } 
     set 
     { 
      SetValue(SelectedIndexProperty, value); 
     } 
    } 

    void UpdateSelectedItem() 
    { 
     SelectedItem = SelectedIndex > -1 ? Children[SelectedIndex].BindingContext : null; 
    } 
}` 

現在你可以使用XAML中的自定義滾動型得到一個水平滾動列表

<custom:ImageGallery ItemsSource="{Binding ImageList}" HeightRequest="100"> <custom:ImageGallery.ItemTemplate> <DataTemplate> < - 通過旋轉的ListView> </DataTemplate> </custom:ImageGallery.ItemTemplate> </custom:ImageGallery>

Answer 3

一些創建水平列表視圖 - 佈局和相關的東西，然後旋轉元素。

這是一個破解，你必須確保它不會妨礙你的佈局（不要把它放在網格中）。但它工作正常。