Xamarin.Forms 4.4 版本新特性

　　最近微软更新了新版本的xamarin.form4.4框架，这个框架对于当前用户来说是一大进步，这个框架升级后可以支持更多的新特性，对于开发者来说是一大进步，同时微软又开始测试新的组件了，另人惊喜的是微软终于推出了CarouseView和SwipeView两个重要的组件，而IndicatorView控件只是一个辅助控件，同时开始支持GIF格式的图片了（以前不支持你敢信，要支持需使用其他的图库）。

　　要使用新的组件，先使用SetFlage方法声明一下，在APP.xaml.cs添加如下代码

 1 public App()
 2 {
 3     InitializeComponent();
 4  
 5     Device.SetFlags(new[] {
 6         "CarouselView_Experimental",
 7         "IndicatorView_Experimental",
 8         "SwipeView_Experimental"
 9     } );
10  
11     MainPage = new AppShell();
12 }

　　一、GIF 动图

<Image Source="https://cataas.com/cat/gif?type=sq" IsAnimationPlaying="True"/>

在Views的xaml中直接添加GIF Image即可，动图默认是循环播放的，如果要停止循环，设置IsAnimationPlaying为false即可。

　　二、CarouseIView 和IndicatorView组件。

　　这两个组件是组合使用的，你可以单独使用，并不影响功能，CarouseIView是一个巨幕组件，用户可以滑动巨幕，来切换内容，同时支持水平滑动和垂直滑动，和CollectionView组件类似，但又稍微不同，CollectionView一般用于大量数据的显示，并且性能非常棒，是微软推出的替代ListView组件的，而CarouseIView主要是水平巨幕功能。

 1 <CarouselView x:Name="carouselView" ItemsSource="{Binding Monkeys}" >
 2                 <CarouselView.ItemTemplate>
 3                     <!-- DataTemplate that defines item appearance -->
 4                     <DataTemplate>
 5                         <StackLayout>
 6                             <Frame HasShadow="True" BorderColor="DarkGray" CornerRadius="5" Margin="20" HeightRequest="300" HorizontalOptions="Center" VerticalOptions="CenterAndExpand">
 7                                 <StackLayout>
 8                                     <Label Text="{Binding Name}" FontAttributes="Bold" FontSize="Large" HorizontalOptions="Center" VerticalOptions="Center" />
 9                                     <Image Source="{Binding ImageUrl}" Aspect="AspectFill" HeightRequest="150" WidthRequest="150" HorizontalOptions="Center" />
10                                     <Label Text="{Binding Location}" HorizontalOptions="Center" />
11                                     <Label Text="{Binding Details}" FontAttributes="Italic" HorizontalOptions="Center" MaxLines="5" LineBreakMode="TailTruncation" />
12                                 </StackLayout>
13                             </Frame>
14                         </StackLayout>
15                     </DataTemplate>
16                 </CarouselView.ItemTemplate>
17             </CarouselView>
18             <IndicatorView ItemsSourceBy="carouselView"
19                    IndicatorColor="LightGray"
20                    SelectedIndicatorColor="DarkGray"
21                    HorizontalOptions="Center" />

　　三、SwipeView组件

　　这是一个侧滑组件，支持上、下、左、右四个方向的滑动，添加SwipeItem来显示隐藏的内容，通过SwipView.RightItems、LeftItems、TopItems、BottomItems控制滑动的方向，同时又SwipeStarted、SwipeChanging、SwipedEnded、CloseRequested事件。同时，SwipeView定义了Close方法，用来关闭Items。

 1 <SwipeView>
 2     <SwipeView.LeftItems>
 3         <SwipeItems>
 4             <SwipeItem Text="Favorite"
 5                        IconImageSource="favorite.png"
 6                        BackgroundColor="LightGreen"
 7                        Invoked="OnFavoriteSwipeItemInvoked" />
 8             <SwipeItem Text="Delete"
 9                        IconImageSource="delete.png"
10                        BackgroundColor="LightPink"
11                        Invoked="OnDeleteSwipeItemInvoked" />
12         </SwipeItems>
13     </SwipeView.LeftItems>
14     <!-- Content -->
15 </SwipeView>

 

　　

posted @ 2020-01-05 16:45  醉梦ai天涯  阅读(727)  评论(0)  编辑  收藏  举报