[英]How can I visually make my Selected Item in a CollectionView (Horizontal), show at the center of my screen?
我有一個包含一些項目的ListView
,當我 select 其中一個項目時,我被移動到一個帶有 Horizontal CollectionView
的新頁面,其中我的SelectedItem
作為我之前在頁面上選擇的項目。 我有這部分工作。
我的問題是,如果我之前在頁面上選擇的項目離右側太遠(必須滾動才能到達它),那么我的SelectedItem
將不會自動顯示在屏幕上。
帶有可見所選項目的圖像:
所選項目不可見的圖像:
如您所見,當我選擇項目“cat 7”時,它在頁面上不可見。
我想要的結果是,一旦從之前的頁面中選擇了一個項目,它將始終立即在下一頁上可見。
有人知道我可以達到這個結果的方法嗎?
我的 xaml:
<CollectionView ItemsSource="{Binding CategorieList}"
ItemsLayout="HorizontalList"
x:Name="CategoryList"
VerticalOptions="Start"
Margin="0,22,0,0"
HeightRequest="32"
SelectionMode="Single"
SelectedItem="{Binding CategorieListSelectedItem, Mode=TwoWay}">
<CollectionView.ItemTemplate>
<DataTemplate>
<Grid>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup Name="CommonStates">
<VisualState Name="Normal" />
<VisualState Name="Selected">
<VisualState.Setters>
<Setter Property="BackgroundColor" Value="transparent" />
<Setter TargetName="SelectedLabel" Property="Label.TextColor" Value="#004EFF"/>
<Setter TargetName="SelectedLabel" Property="Label.FontSize" Value="22"/>
<Setter TargetName="SelectedLabel" Property="Label.Margin" Value="20,-2,20,0"/>
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Label Text="{Binding Name}"
x:Name="SelectedLabel"
Margin="20,0,20,0"
TextColor="#707070"
FontSize="20"
FontFamily="{StaticResource Helvetica}"/>
</Grid>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
我的視圖模型:
public Categories CategorieListSelectedItem
{
get
{
return categorieListSelectedItem;
}
set
{
categorieListSelectedItem = value;
OnPropertyChanged("CategorieListSelectedItem");
ProductList.Clear();
if(categorieListSelectedItem.Products != null)
{
foreach (var item in CategorieListSelectedItem.Products)
{
productList.Add(new ProductDetailsViewModel(item));
}
}
OnPropertyChanged("ProductList");
}
}
我不確定您的CategorieList
中有多少Name
。 我以 8 為例。 當計數不夠時, Name
會顯示但不在中心。
public partial class Page3 : ContentPage
{
public ObservableCollection<Categories> CategorieList { get; set; }
public Categories SelectedCategorie { get; set; }
public Page3()
{
InitializeComponent();
CategorieList = new ObservableCollection<Categories>()
{
new Categories(){ Name="cat 1"},
new Categories(){ Name="cat 2"},
new Categories(){ Name="cat 3"},
new Categories(){ Name="cat 4"},
new Categories(){ Name="cat 5"},
new Categories(){ Name="cat 6"},
new Categories(){ Name="cat 7"},
new Categories(){ Name="cat 8"},
//new Categories(){ Name="cat 9"},
//new Categories(){ Name="cat 10"},
//new Categories(){ Name="cat 11"},
};
SelectedCategorie = CategorieList.Skip(6).FirstOrDefault();
this.BindingContext = this;
}
protected override void OnAppearing()
{
CategoryList.ScrollTo(CategoryList.SelectedItem, null, ScrollToPosition.Center, false);
}
}
public class Categories
{
public string Name { get; set; }
}
SelectedItem 是cat4
:
CategorieListSelectedItem = CategorieList.Skip(3).FirstOrDefault();
SelectedItem 是cat7
:
CategorieListSelectedItem = CategorieList.Skip(6).FirstOrDefault();
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.