微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

当我更改网格时,集合视图被破坏

如何解决当我更改网格时,集合视图被破坏

我有一个列表,其中可以是一个或多个网格。我正在尝试为此使用 collectionview。但是当我更改网格时,某些 collectionview 项目的视图被破坏(在 iOS 应用程序上)。如 gif:

enter image description here

但是当我滑动滚动条时,破碎的网格会变得更好。我的项目是自定义项目。这就是我无法共享示例应用程序的原因。但是collectionview实现如下:

<RefreshView Command="{Binding RefreshCommand}"
              IsRefreshing="{Binding IsRefreshing}">
     <CollectionView x:Name="FlowListFileFolder" 
                 AutomationId="FileSystemPage_MainScreenListView"
                 IsGrouped="true"
                 ItemsSource="{Binding FlowListCloudItem}"
                 ItemsLayout="{Binding CollectionViewItemsLayout}">
         <CollectionView.GroupHeaderTemplate>
             <DataTemplate>
                 <StackLayout Style="{DynamicResource FlowListGroupTitleWrapperStyle}">
                     <Label Text="{Binding Path=Key}" 
                                Style="{DynamicResource FlowListGroupTitleStyle}" />
                 </StackLayout>
             </DataTemplate>
         </CollectionView.GroupHeaderTemplate>
         <CollectionView.ItemTemplate>
             <DataTemplate>
                 <local:ItemGridView LongPressEvent="Handle_LongPressEvent" SingleTapEvent="Handle_TappedEvent">
                     <local:CustomFolderFrame Style="{DynamicResource FspCiFrameWrapperStyle}" BorderColor="{Binding FrameColor}">
                         <StackLayout Orientation="Vertical" Spacing="0" BackgroundColor="{Binding FrameColor}" Margin="1">
                             <Grid Style="{Binding FspCi_GridStyle}">
                                 <StackLayout AutomationId="FileSystemPage_FolderStackLayout" 
                                                      Style="{DynamicResource FspCiGeneralWrapperLayoutStyle}">
                                     <StackLayout Style="{Binding FspCiThumbnailImageAndinformation_GeneralWrapperLayoutStyle}">
                                         <StackLayout Style="{Binding FspCiThumbnailImage_WrapperLayoutStyle}">
                                             <ff:CachedImage AutomationId="{Binding LvItemThumbnailSource,StringFormat='FolderIcon_{0}'}"
                                                                     Style="{Binding FspCiFolderThumbnailImageStyle}" />
                                             <ff:CachedImage Style="{Binding FspCiFileThumbnailImageStyle}" />
                                         </StackLayout>
    
                                         <StackLayout Style="{Binding FspCiCloudIteminformation_WrapperLayoutStyle}">
                                             <StackLayout Orientation="Horizontal" HorizontalOptions="FillAndExpand" Spacing="5">
    
                                                 <Label AutomationId="FileSystemPage_lbldisplayNameFolder" 
                                                                Text="{Binding displayName}" 
                                                                Style="{DynamicResource FspCidisplayNameStyle}" />
                                                 <ff:CachedImage Source="group.png" Style="{Binding FspCiGroupIcon_ImageStyle}" />
                                             </StackLayout>
                                             <Label Text="{Binding CreationDate}" 
                                                            Style="{DynamicResource FspCiCreationDateStyle}" />
                                         </StackLayout>
                                     </StackLayout>
                                 </StackLayout>
    
                                 <StackLayout Style="{Binding FspCiCheckUncheckMoreDetail_WrapperLayoutStyle}">
                                     <StackLayout Style="{Binding FspCiCheck_StackLayoutStyle}">
                                         <ff:CachedImage AutomationId="{Binding displayName,StringFormat='FileSystemPage_{0}_checked'}" 
                                                                 Source="checked.png" 
                                                                 Style="{Binding FspCiCheckUncheck_ImageStyle}" />
                                     </StackLayout>
                                     <StackLayout Style="{Binding FspCiUncheck_StackLayoutStyle}">
                                         <ff:CachedImage AutomationId="{Binding displayName,StringFormat='FileSystemPage_{0}_unchecked'}" 
                                                                 Source="unchecked.png" 
                                                                 Style="{Binding FspCiCheckUncheck_ImageStyle}" />
                                     </StackLayout>
                                     <StackLayout Style="{Binding FspCiMoreDetail_StackLayoutStyle}">
                                         <ff:CachedImage AutomationId="FileSystemPage_ItemmoreDetail" 
                                                                 Source="ic_dots_gray.png" 
                                                                 Style="{Binding FspCiCheckUncheck_ImageStyle}"/>
                                         <StackLayout.GestureRecognizers>
                                             <TapGestureRecognizer Tapped="ItemmoreDetail_Clicked" />
                                         </StackLayout.GestureRecognizers>
                                     </StackLayout>
                                 </StackLayout>
                             </Grid>
                         </StackLayout>
                     </local:CustomFolderFrame>
                 </local:ItemGridView>
             </DataTemplate>
         </CollectionView.ItemTemplate>
         <CollectionView.Footer>
             <StackLayout Style="{DynamicResource FspCiFooterWrapperLayoutStyle}">
                 <Label Text="{Binding LabelFolderCount}" 
                        Style="{DynamicResource FspCiFooterFileFolderCountStyle}" />
                 <Label Text="{Binding LabelFileCount}" 
                        Style="{DynamicResource FspCiFooterFileFolderCountStyle}" />
             </StackLayout>
         </CollectionView.Footer>
     </CollectionView>
 </RefreshView>

为了在一个项目中支持不同的屏幕,我使用了不同的样式,这些样式会根据设备的视口信息而变化。当应用程序打开时,我获取设备的视口信息并设置适合视口的样式。这些样式来自那里。

当我单击网格按钮时,我将其中一些样式更改如下:

public class FileSystemviewmodel : INotifyPropertyChanged
 {
     public event PropertyChangedEventHandler PropertyChanged;
    
     protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
     {
         PropertyChanged?.Invoke(this,new PropertyChangedEventArgs(propertyName));
     }
    
     protected void SetValue<T>(ref T backingField,T value,[CallerMemberName] string propertyName = null)
     {
         if (EqualityComparer<T>.Default.Equals(backingField,value))
             return;
         backingField = value;
         OnPropertyChanged(propertyName);
     }
    
     private ItemsLayout collectionViewItemsLayout;
     public ItemsLayout CollectionViewItemsLayout { get => collectionViewItemsLayout; set { SetValue(ref collectionViewItemsLayout,value); } }
    
     public Command GridClicked()
     {
         var btnGrid_Clicked = new Command(
             async () =>  {
                 if (FlowListGridCount == 1)
                 {
                     UpdateMultipleGrid();
                 }
                 else
                 {
                     UpdateOneGrid();
                 }
             });
         return btnGrid_Clicked;
     }
    
    
     public void UpdateMultipleGrid()
     {
         foreach (var item in CloudItemList[0])
         {
             SetFolderTwoGridView(item);
         }
         foreach (var item in CloudItemList[1])
         {
             SetFileTwoGridView(item);
         }
         Helpers.Settings.FlowColumnCount = FlowListGridCount = ElementResolutionsHelper.GetPageFolderColumnCount(); //GetPageFolderColumnCount returns column count that is suitable with screen
         CollectionViewItemsLayout = new GridItemsLayout(FlowListGridCount,ItemsLayoutOrientation.Vertical);
     }
    
     public void UpdateOneGrid()
     {
         foreach (var item in CloudItemList[0])
         {
             SetFolderOneGridView(item);
         }
         foreach (var item in CloudItemList[1])
         {
             SetFileOneGridView(item);
         }
    
         Helpers.Settings.FlowColumnCount = FlowListGridCount = ElementResolutionsHelper.GetPageFolderColumnCount(); //GetPageFolderColumnCount returns 1 for this situation
         CollectionViewItemsLayout = new GridItemsLayout(FlowListGridCount,ItemsLayoutOrientation.Vertical);
     }
    
     private void SetFolderTwoGridView(CloudItemViewingResponse item)
     {
         if (item.IsShared)
             item.LvItemThumbnailSource = "folder_share.png";
         else
             item.LvItemThumbnailSource = "ic_folder.png";
    
         item.FspCiCheck_StackLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridCheck_StackLayoutStyle"]);
         item.FspCiUncheck_StackLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridUncheck_StackLayoutStyle"]);
         item.FspCiMoreDetail_StackLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridMoreDetail_StackLayoutStyle"]);
         item.FspCiCheckUncheck_ImageStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridCheckUncheckMoreDetail_ImageStyle"]);
         item.FspCiCheckUncheckMoreDetail_WrapperLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridCheckUncheckMoreDetail_WrapperLayoutStyle"]);
         item.FspCiCloudIteminformation_WrapperLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridCloudIteminformation_WrapperLayoutStyle"]);
         item.FspCiThumbnailImage_WrapperLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridFolderThumbnailImage_WrapperLayoutStyle"]);
         item.FspCiFolderThumbnailImageStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridFolderThumbnailImageStyle"]);
         item.FspCiFileThumbnailImageStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridFileThumbnailImageStyle"]);
         item.FspCiThumbnailImageAndinformation_GeneralWrapperLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridThumbnailImageAndinformation_GeneralWrapperLayoutStyle"]);
         item.FspCi_GridStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridFolder_GridStyle"]);
            
     }
    
     private void SetFileTwoGridView(CloudItemViewingResponse item)
     {
         item.FspCiCheck_StackLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridCheck_StackLayoutStyle"]);
         item.FspCiUncheck_StackLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridUncheck_StackLayoutStyle"]);
         item.FspCiMoreDetail_StackLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridMoreDetail_StackLayoutStyle"]);
         item.FspCiCheckUncheck_ImageStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridCheckUncheckMoreDetail_ImageStyle"]);
         item.FspCiCheckUncheckMoreDetail_WrapperLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridCheckUncheckMoreDetail_WrapperLayoutStyle"]);
         item.FspCiCloudIteminformation_WrapperLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridCloudIteminformation_WrapperLayoutStyle"]);
         item.FspCiThumbnailImage_WrapperLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridFileThumbnailImage_WrapperLayoutStyle"]);
         item.FspCiFolderThumbnailImageStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridFolderThumbnailImageStyle"]);
         item.FspCiFileThumbnailImageStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridFileThumbnailImageStyle"]);
         item.FspCiThumbnailImageAndinformation_GeneralWrapperLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridThumbnailImageAndinformation_GeneralWrapperLayoutStyle"]);
         item.FspCi_GridStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiMultipleGridFile_GridStyle"]);
            
     }
    
     private void SetFolderOneGridView(CloudItemViewingResponse item)
     {
         if (item.IsShared)
             item.LvItemThumbnailSource = "folder_share.png";
         else
             item.LvItemThumbnailSource = "ic_folder.png";
    
         item.FspCiCheck_StackLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGridCheck_StackLayoutStyle"]);
         item.FspCiUncheck_StackLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGridUncheck_StackLayoutStyle"]);
         item.FspCiMoreDetail_StackLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGridMoreDetail_StackLayoutStyle"]);
         item.FspCiCheckUncheck_ImageStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGridCheckUncheckMoreDetail_ImageStyle"]);
         item.FspCiCheckUncheckMoreDetail_WrapperLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGridCheckUncheckMoreDetail_WrapperLayoutStyle"]);
         item.FspCiCloudIteminformation_WrapperLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGridCloudIteminformation_WrapperLayoutStyle"]);
         item.FspCiThumbnailImage_WrapperLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGridThumbnailImage_WrapperLayoutStyle"]);
         item.FspCiFolderThumbnailImageStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGridFolderThumbnailImageStyle"]);
         item.FspCiFileThumbnailImageStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGridFileThumbnailImageStyle"]);
         item.FspCiThumbnailImageAndinformation_GeneralWrapperLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGridThumbnailImageAndinformation_GeneralWrapperLayoutStyle"]);
         item.FspCi_GridStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGrid_GridStyle"]);
     }
    
     private void SetFileOneGridView(CloudItemViewingResponse item)
     {
         item.FspCiCheck_StackLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGridCheck_StackLayoutStyle"]);
         item.FspCiUncheck_StackLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGridUncheck_StackLayoutStyle"]);
         item.FspCiMoreDetail_StackLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGridMoreDetail_StackLayoutStyle"]);
         item.FspCiCheckUncheck_ImageStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGridCheckUncheckMoreDetail_ImageStyle"]);
         item.FspCiCheckUncheckMoreDetail_WrapperLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGridCheckUncheckMoreDetail_WrapperLayoutStyle"]);
         item.FspCiCloudIteminformation_WrapperLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGridCloudIteminformation_WrapperLayoutStyle"]);
         item.FspCiThumbnailImage_WrapperLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGridThumbnailImage_WrapperLayoutStyle"]);
         item.FspCiFolderThumbnailImageStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGridFolderThumbnailImageStyle"]);
         item.FspCiFileThumbnailImageStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGridFileThumbnailImageStyle"]);
         item.FspCiThumbnailImageAndinformation_GeneralWrapperLayoutStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGridThumbnailImageAndinformation_GeneralWrapperLayoutStyle"]);
         item.FspCi_GridStyle = (Style)((Application.Current.Resources.MergedDictionaries).ElementAt((int)EStyleItem.Devicesstyle)["FspCiOneGrid_GridStyle"]);
     }
 }

如果出现这种情况,我们将更改列表视图的 HasUnevenRows 或 CachingStrategy 值。 collectionview 有这样的东西吗?

并且 collectionview 网格在 Android 上不会损坏。但是当我改变网格时,它又回到了列表的顶部。如果我滑动到底部,当我改变网格时,我不想回到顶部。

提前致谢。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。