Windows 8实用窍门系列：9.Windows 8中使用FlipView-白红宇

Windows 8实用窍门系列：9.Windows 8中使用FlipView

阅读量：730 次

发布时间：2019-03-22

本文共 2515 字，大约阅读时间需要 8 分钟。

　　FlipView控件类似于翻页控件，并且是现成的翻页按钮，你只需要为其增加数据项即可。本文讲述两种方式的FlipView项目和展示。

　　一：直接前台FlipViewItem

　　效果如下：

　　二：前台设置DataTemplate，后台实体集方式添加数据项。

///     /// 可用于自身或导航至 Frame 内部的空白页。    /// 
    public sealed partial class MainPage : Page    {        public MainPage()        {            this.InitializeComponent();            this.fvShow.ItemsSource = ImgModel.GetImgData();        }        ///         /// 在此页将要在 Frame 中显示时进行调用。        /// 
        /// 描述如何访问此页的事件数据。Parameter        /// 属性通常用于配置页。        protected override void OnNavigatedTo(NavigationEventArgs e)        {        }    }    ///     /// 图片实体    /// 
    public class ImgModel    {        ///         /// 图片名字        /// 
        public string ImgName { get; set; }        ///         /// 图片地址        /// 
        public string ImgAddr { get; set; }        ///         /// 图片URL        /// 
        public string ImgUrl { get; set; }        public static List
    
      GetImgData()        {            List
     
       list = new List
      
       ();            list.Add(new ImgModel() { ImgName = "名字：北京冬景", ImgAddr = "地址：北京市", ImgUrl = "http://imgcache.qq.com/club/item/wallpic/items/2/3922/760_300_3922.jpg" });            list.Add(new ImgModel() { ImgName = "名字：上海春景", ImgAddr = "地址：上海市", ImgUrl = "http://imgcache.qq.com/club/item/wallpic/items/7/3147/760_300_3147.jpg" });            list.Add(new ImgModel() { ImgName = "名字：天津秋景", ImgAddr = "地址：天津市", ImgUrl = "http://imgcache.qq.com/club/item/wallpic/items/6/3966/c_760_300_3966.jpg" });            list.Add(new ImgModel() { ImgName = "名字：海南夏景", ImgAddr = "地址：海南市", ImgUrl = "http://imgcache.qq.com/club/item/wallpic/items/5/3695/760_300_3695.jpg" });            list.Add(new ImgModel() { ImgName = "名字：成都风景", ImgAddr = "地址：成都市", ImgUrl = "http://imgcache.qq.com/club/item/wallpic/items/8/2518/760_300_2518.jpg" });            return list;        }    }

　　看此方式的效果如下：

　　最后如需源码请点击下载。

转载地址：http://ytkwk.baihongyu.com/

你可能感兴趣的文章