【发布时间】:2017-12-26 00:47:34
【问题描述】:
在我的应用程序中,我在主页中使用了一个GridView 和一个ListView。上述列表位于Dictionary 中,我将它们作为ContentPresenter 的内容加载到主页中,并且该元素包含在ScrollViewer 中。
主页的 XAML:
<Pivot Grid.Row="1"
SelectionChanged="Pivot_SelectionChanged"
SelectedIndex="{Binding PivotIndex, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}">
<PivotItem>
<PivotItem.Header>
<TextBlock Text="Home"/>
</PivotItem.Header>
<PivotItem.Content>
<ScrollViewer ViewChanged="Scroll_ViewChanged">
<ContentPresenter ContentTemplate="{StaticResource SwitchableHomeView}"/>
</ScrollViewer>
</PivotItem.Content>
</PivotItem>
<PivotItem>
<PivotItem.Header>
<TextBlock Text="Fitness"/>
</PivotItem.Header>
<PivotItem.Content>
<ScrollViewer ViewChanged="Scroll_ViewChanged">
<ContentPresenter ContentTemplate="{StaticResource SwitchableFitnessView}"/>
</ScrollViewer>
</PivotItem.Content>
</PivotItem>
</Pivot>
Dictionary 类的 XAML:
<DataTemplate x:Key="SwitchableHomeView"
x:DataType="data:ItemHelper">
<UserControl>
<StackPanel>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup>
<VisualState>
<VisualState.StateTriggers>
<AdaptiveTrigger MinWindowWidth="0"/>
</VisualState.StateTriggers>
<VisualState.Setters>
<Setter Target="HomeListView.Visibility"
Value="Visible"/>
<Setter Target="HomeGridView.Visibility"
Value="Collapsed"/>
</VisualState.Setters>
</VisualState>
<VisualState>
<VisualState.StateTriggers>
<AdaptiveTrigger MinWindowWidth="901"/>
</VisualState.StateTriggers>
<VisualState.Setters>
<Setter Target="HomeListView.Visibility"
Value="Collapsed"/>
<Setter Target="HomeGridView.Visibility"
Value="Visible"/>
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<ListView Name="HomeListView"
Style="{StaticResource ListViewCustomStyle}"
ItemsSource="{Binding HomeList, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}"
ItemClick="Article_ItemClick"
Loaded="ArticleCollection_Loaded"/>
<GridView Name="HomeGridView"
Style="{StaticResource GridViewCustomStyle}"
ItemsSource="{Binding HomeList, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}"
ItemClick="Article_ItemClick"
Loaded="ArticleCollection_Loaded"/>
</StackPanel>
</UserControl>
</DataTemplate>
<Style x:Key="GridViewCustomStyle"
TargetType="GridView">
<Setter Property="SelectionMode"
Value="None"/>
<Setter Property="ItemsPanel"
Value="{StaticResource GridViewCenteredItemsPanel}"/>
<Setter Property="IsItemClickEnabled"
Value="True"/>
<Setter Property="ShowsScrollingPlaceholders"
Value="True"/>
<Setter Property="ItemContainerStyle"
Value="{StaticResource CustomGridViewItemStyle}"/>
<Setter Property="ItemTemplate"
Value="{StaticResource CustomGridItemTemplate}"/>
<Setter Property="ItemContainerTransitions"
Value="{StaticResource GridViewItemCustomTransitions}"/>
</Style>
<Style x:Key="ListViewCustomStyle"
TargetType="ListView">
<Setter Property="SelectionMode"
Value="None"/>
<Setter Property="IsItemClickEnabled"
Value="True"/>
<Setter Property="ShowsScrollingPlaceholders"
Value="True"/>
<Setter Property="ItemContainerStyle"
Value="{StaticResource StretchedListView}"/>
<Setter Property="ItemTemplate"
Value="{StaticResource CustomListItemTemplate}"/>
<Setter Property="ItemContainerTransitions"
Value="{StaticResource GridViewItemCustomTransitions}"/>
</Style>
字典类的代码隐藏:
private async void ArticleCollection_Loaded(object sender, RoutedEventArgs e)
{
if (navigatedUri != null)
{
if (sender is GridView)
{
var gv = sender as GridView;
var item = (gv.ItemsSource as ObservableCollection<ItemHelper>)
.Where(compare => compare.ItemImage?.UriSource?.OriginalString == navigatedUri).FirstOrDefault();
await Dispatcher.RunAsync(Windows.UI.Core.CoreDispatcherPriority.Normal, async() =>
{
gv.UpdateLayout();
await Task.Delay(500);
gv.ScrollIntoView(item);
//gv.UpdateLayout();
});
var animation = ConnectedAnimationService.GetForCurrentView().GetAnimation(StaticProperties.SquareAnimationKey);
if (animation != null)
{
if (gv.ContainerFromItem(item) is GridViewItem container)
{
var root = (FrameworkElement)container.ContentTemplateRoot;
var image = (Image)root.FindName("Image");
animation.TryStart(image);
}
else
{
animation.Cancel();
}
}
if (gv.Visibility == Visibility.Visible)
{
navigatedUri = null;
}
}
else if (sender is ListView)
{
var gv = sender as ListView;
var animation = ConnectedAnimationService.GetForCurrentView().GetAnimation(StaticProperties.SquareAnimationKey);
if (animation != null)
{
var item = (gv.ItemsSource as ObservableCollection<ItemHelper>)
.Where(compare => compare.ItemImage?.UriSource?.OriginalString == navigatedUri).First();
await Dispatcher.RunAsync(Windows.UI.Core.CoreDispatcherPriority.Normal, async() =>
{
gv.UpdateLayout();
await Task.Delay(500);
gv.ScrollIntoView(item);
//gv.UpdateLayout();
});
if (gv.ContainerFromItem(item) is GridViewItem container)
{
var root = (FrameworkElement)container.ContentTemplateRoot;
var image = (Image)root.FindName("image");
// Wait for image opened. In future Insider Preview releases, this won't be necessary.
image.Opacity = 0;
animation.TryStart(image);
}
else
{
animation.Cancel();
}
}
if (gv.Visibility == Visibility.Visible)
{
navigatedUri = null;
}
}
}
}
我根据屏幕大小切换ListView和GridView。因此,当我在查看项目后导航回MainPage 时,ListView 和GridView 都被加载,Loaded 事件被触发。然后我将ListView 和GridView 滚动到该项目,但它始终显示第一项。我尝试了谷歌的各种解决方案,但没有一个对我有用。
所以我想问一下我是否使用了正确的方法来使其工作。或者有什么更好的方法可以完成这项工作。谢谢
【问题讨论】:
标签: c# xaml listview gridview uwp