与众不同 windows phone (34) - 8.0 新的控件: LongListSelector

简介: 原文:与众不同 windows phone (34) - 8.0 新的控件: LongListSelector[源码下载] 与众不同 windows phone (34) - 8.0 新的控件: LongListSelector 作者:webabcd介绍与众不同 windows phone 8.
原文: 与众不同 windows phone (34) - 8.0 新的控件: LongListSelector

[源码下载]


与众不同 windows phone (34) - 8.0 新的控件: LongListSelector



作者:webabcd


介绍
与众不同 windows phone 8.0 之 新的控件

  • 新的控件 - LongListSelector



示例
演示 LongListSelector 控件的应用

1、提供数据
Controls/CityInfo.txt

101330101=澳门=aomen
101080904=阿巴嘎=abagaqi
101271901=阿坝=aba
101050104=阿城=acheng
101081102=阿尔山=aershan
101131504=阿合奇=aheqi
101130801=阿克苏=akesu
101131503=阿克陶=aketao
101130701=阿拉尔=alaer
101131606=阿拉山口=alashankou
101081202=阿右旗=alashanyouqi
101081201=阿左旗=alashanzuoqi
101131401=阿勒泰=aletai
101140701=阿里=ali
101080603=阿鲁旗=aluqi
101081003=阿荣旗=arongqi
101131501=阿图什=atushi
101130809=阿瓦提=awati
101050503=安达=anda
101160208=安定=anding
101140605=安多=anduo
101240612=安福=anfu
101090220=安国=anguo
101250704=安化=anhua
101210203=安吉=anji
101110701=安康=ankang

Controls/CityInfo.cs

namespace Demo.Controls
{
    /// <summary>
    /// city 信息实体类
    /// </summary>
    public class CityInfo
    {
        /// <summary>
        /// city 标识
        /// </summary>
        public string CityId { get; set; }
        /// <summary>
        /// city 名称
        /// </summary>
        public string Name { get; set; }
        /// <summary>
        /// city 拼音
        /// </summary>
        public string Pinyin { get; set; }

        /// <summary>
        /// 获取城市的拼音首字母
        /// </summary>
        public static string GetFirstPinyinKey(CityInfo cityInfo)
        {
            char indexLetter = char.ToUpper(cityInfo.Pinyin[0]);

            if (indexLetter < 'A' || indexLetter > 'Z')
            {
                indexLetter = '#';
            }

            return indexLetter.ToString();
        }
    }
}

Controls/CityInfoInGroup.cs

using System.Collections.Generic;

namespace Demo.Controls
{
    /// <summary>
    /// 为 LongListSelector 提供数据的实体类
    /// </summary>
    public class CityInfoInGroup : List<CityInfo>
    {
        public CityInfoInGroup(string indexLetter)
        {
            IndexLetter = indexLetter;
        }

        // 某组数据的拼音首字母
        public string IndexLetter { get; set; }

        public bool HasItems { get { return Count > 0; } }
    }
}

Controls/CityData.cs

using System;
using System.Collections.Generic;
using System.Windows.Resources;
using System.IO;
using System.Linq;

namespace Demo.Controls
{
    /// <summary>
    /// 城市数据(为 LongListSelector 提供数据)
    /// </summary>
    public class CityData
    {
        // 按拼音首字母分组城市数据
        private static readonly string _groupLetters = "#abcdefghijklmnopqrstuvwxyz";

        private static List<CityInfoInGroup> _data;
        private static List<CityInfo> _cities;

        /// <summary>
        /// 获取全部城市数据 for LongListSelector
        /// </summary>
        public static List<CityInfoInGroup> GetData()
        {
            if (_data == null)
            {
                _data = new List<CityInfoInGroup>();
                _cities = new List<CityInfo>();

                Dictionary<string, CityInfoInGroup> groups = new Dictionary<string, CityInfoInGroup>();

                foreach (char c in _groupLetters.ToUpper())
                {
                    CityInfoInGroup group = new CityInfoInGroup(c.ToString());
                    _data.Add(group);
                    groups[c.ToString()] = group;
                }

                StreamResourceInfo resource = App.GetResourceStream(new Uri("Controls/CityInfo.txt", UriKind.Relative));
                StreamReader sr = new StreamReader(resource.Stream);
                string line = sr.ReadLine();
                while (line != null)
                {
                    var ary = line.Split('=');
                    var cityInfo = new CityInfo { CityId = ary[0], Name = ary[1], Pinyin = ary[2] };
                    _cities.Add(cityInfo);
                    groups[CityInfo.GetFirstPinyinKey(cityInfo)].Add(cityInfo);

                    line = sr.ReadLine();
                }
            }

            return _data;
        }

        /// <summary>
        /// 获取包含指定关键字的城市数据 for LongListSelector
        /// </summary>
        public static List<CityInfoInGroup> GetData(string searchKey)
        {
            searchKey = searchKey.ToLower();

            List<CityInfoInGroup> result = new List<CityInfoInGroup>();
            List<CityInfoInGroup> data = GetData();

            foreach (CityInfoInGroup ciig in data)
            {
                List<CityInfo> childData = ciig.Where(p => p.Name.Contains(searchKey) || p.Pinyin.Contains(searchKey)).ToList();
                if (childData != null)
                {
                    CityInfoInGroup resultCiig = new CityInfoInGroup(ciig.IndexLetter);
                    resultCiig.AddRange(childData);

                    result.Add(resultCiig);
                }
            }

            return result;
        }
    }
}


2、使用数据
Controls/LongListSelectorDemo.xaml

<phone:PhoneApplicationPage
    x:Class="Demo.Controls.LongListSelectorDemo"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait" Orientation="Portrait"
    mc:Ignorable="d"
    shell:SystemTray.IsVisible="True">

    <phone:PhoneApplicationPage.Resources>
        <!--
            LongListSelector 的 GroupHeader 模板
        -->
        <DataTemplate x:Key="GroupHeaderTemplate">
            <Grid Margin="{StaticResource PhoneTouchTargetOverhang}" Background="Transparent">
                <Border Background="{StaticResource PhoneAccentBrush}" Width="75" Height="75" HorizontalAlignment="Left">
                    <TextBlock Text="{Binding IndexLetter}" Foreground="{StaticResource PhoneForegroundBrush}" Style="{StaticResource PhoneTextExtraLargeStyle}"/>
                </Border>
            </Grid>
        </DataTemplate>

        <!--
            LongListSelector 的 Item 模板
        -->
        <DataTemplate x:Key="ItemTemplate">
            <Grid Margin="{StaticResource PhoneTouchTargetOverhang}" Background="Transparent">
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{Binding Name}" Style="{StaticResource PhoneTextLargeStyle}" />
                    <TextBlock Text="{Binding Pinyin}" Style="{StaticResource PhoneTextLargeStyle}" Margin="10 0 0 0" />
                </StackPanel>
            </Grid>
        </DataTemplate>

        <phone:JumpListItemBackgroundConverter x:Key="BackgroundConverter"/>
        <phone:JumpListItemForegroundConverter x:Key="ForegroundConverter"/>

        <!--
            JumpList(弹出的索引窗口) 的 样式
        -->
        <Style x:Key="JumpListStyle" TargetType="phone:LongListSelector">
            <Setter Property="GridCellSize"  Value="113,113"/>
            <Setter Property="LayoutMode" Value="Grid" />
            <Setter Property="ItemTemplate">
                <Setter.Value >
                    <DataTemplate >
                        <Grid>
                            <Border Background="{Binding Converter={StaticResource BackgroundConverter}}" Width="113" Height="113" Margin="6">
                                <TextBlock Text="{Binding IndexLetter}"  Foreground="{Binding Converter={StaticResource ForegroundConverter}}" 
                                           FontWeight="Bold" FontSize="48" Padding="6" VerticalAlignment="Center" />
                            </Border>
                        </Grid>
                    </DataTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </phone:PhoneApplicationPage.Resources>

    <Grid x:Name="LayoutRoot" Background="Transparent">
        <phone:LongListSelector Name="longListSelector" ItemsSource="{Binding}"
                                IsGroupingEnabled="True" HideEmptyGroups="True" LayoutMode="List"
                                SelectionChanged="longListSelector_SelectionChanged"
                                JumpListStyle="{StaticResource JumpListStyle}"
                                GroupHeaderTemplate="{StaticResource GroupHeaderTemplate}"                                                                           
                                ItemTemplate="{StaticResource ItemTemplate}">
        </phone:LongListSelector>
    </Grid>

</phone:PhoneApplicationPage>

Controls/LongListSelectorDemo.cs

/*
 * 演示 LongListSelector 控件的应用
 */

using System.Collections.Generic;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Navigation;
using Microsoft.Phone.Controls;
using System.Windows.Media;
using System.Diagnostics;
using System.Threading.Tasks;

namespace Demo.Controls
{
    public partial class LongListSelectorDemo : PhoneApplicationPage
    {
        public LongListSelectorDemo()
        {
            InitializeComponent();
        }

        protected async override void OnNavigatedTo(NavigationEventArgs e)
        {
            await Task.Run(() =>
            {
                this.longListSelector.Dispatcher.BeginInvoke(() =>
                {
                    // 指定 LongListSelector 的数据源
                    longListSelector.ItemsSource = CityData.GetData();
                });
            });

            base.OnNavigatedTo(e);
        }

        private void longListSelector_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            var selectedItem = longListSelector.SelectedItem;

            // 滚动到指定的 item
            longListSelector.ScrollTo(selectedItem);
        }
    }
}



OK
[源码下载]

目录
相关文章
|
2月前
|
JavaScript Linux C#
【傻瓜级JS-DLL-WINCC-PLC交互】1.C#用windows窗体控件创建.net控件
【傻瓜级JS-DLL-WINCC-PLC交互】1.C#用windows窗体控件创建.net控件
94 0
|
C++ Windows
C++ Windows窗口程序:子窗口控件之按钮类button
C++ Windows窗口程序:子窗口控件之按钮类button
683 0
|
API C# Windows
C#实现操作Windows窗口句柄:遍历、查找窗体和控件【窗口句柄最全总结之一】
C#对Windows窗口或窗口句柄的操作,都是通过 P/Invoke Win32 API 实现的,DllImport引入Windows API操作窗口(句柄),可以实现枚举已打开的窗口、向窗口...
2695 0
C#实现操作Windows窗口句柄:遍历、查找窗体和控件【窗口句柄最全总结之一】
|
Windows
Windows程序设计——Windows单选按钮、复选框、分组框控件
Windows程序设计——Windows单选按钮、复选框、分组框控件
555 0
Windows程序设计——Windows单选按钮、复选框、分组框控件
|
Windows
Windows程序设计——(源代码)Windows单选按钮、复选框、分组框控件
Windows程序设计——(源代码)Windows单选按钮、复选框、分组框控件
186 0
|
Android开发 iOS开发 Windows
Windows Phone 寿终正寝了,这些经典机型你还记得吗?
不久前,随着最后一家WP手机厂商惠普宣布取消今后Windows Phone的研发计划,以及微软官方声明对WP8.1系统今后所有升级维护的终止,WP手机,作为曾经和安卓手机、苹果手机并驾齐驱的三大智能手机之一,正式寿终正寝。
1355 0
Windows Phone 寿终正寝了,这些经典机型你还记得吗?
|
XML 开发框架 前端开发
Windows Phone快速入门需掌握哪些能力
在此之前,先普及下Windows Phone的概念和开发工具的介绍。 Windows Phone是微软公司开发的手机操作系统,它将微软旗下的Xbox Live游戏、Xbox Music音乐与独特的视频体验集成至手机中。2012年6月21日,微软正式发布Windows Phone 8,采用和Windows 8相同的Windows NT内核,同时也针对市场的Windows Phone 7.5发布Windows Phone 7.8。
148 0
Windows Phone快速入门需掌握哪些能力
|
移动开发 Android开发 开发者
Windows Phone 8.1 新功能汇总 开发者预览版开放下载
在Build 2014大会上,微软正式发布了传闻已久的Windows Phone 8.1系统,所有的Windows Phone 8手机都可以升级,微软这次可谓是十分厚道。虽然并非迭代升级,但WP 8.1还是拥有很多重大更新,对于微软进一步完善移动平台拥有积极的意义。下面,就一起来了解一下WP 8.1的主要新特性。
244 0
Windows Phone 8.1 新功能汇总 开发者预览版开放下载
|
编解码 前端开发 JavaScript
Windows Phone 下开发 LBS 应用
基于位置的服务(Location Based Service,LBS),它是通过电信移动运营商的无线电通讯网络(如GSM网、CDMA网)或外部定位方式(如GPS)获取移动终端用户的位置信息(地理坐标,或大地坐标),在GIS(Geographic Information System,地理信息系统)平台的支持下,为用户提供相应服务的一种增值业务。
179 0
windows窗口中控件的样式
windows窗口中控件的样式一.按钮样式 button BS_AUTO3STATE 创建一个与三态复选框相同的按钮,但该框在用户选择时更改其状态。状态循环通过检查,不确定和清除。 BS_AUTOCHECKBOX 创建一个与复选框相同的按钮,但每次用户选中复选框时,检查状态会自动在已选中和已清除之间切换。
1299 0