• 【WindowsPhone】 (一)控件、布局与界面


    1、直接用可视化集成开发环境 Expression Blend 4 设计App并编写代码和用VS新建 Silverlight For Windows Phone项目文件进行设计、编码的效果是一样的,相对而言 Expression Blend 4 对wp7的界面设计更为直观。Expression Blend 4 是微软最新的silverlight界面设计软件,提供可视化的界面布局,但是视图中的一些小细节还是用VS直接输入XAML更加快捷。
    2、下图为XAML的命名空间,其中两个重要的属性 xmlns:phonexmlns:shell 都位于 Microsoft.Phone.dll下,这是微软为WP7提供的一组智能手机特性封装库。

    3、控件(此处省略。。)
        可以注意的有两点:
    (1)Slider控件,它比较特殊,如果给它的Value属性在还没有触发时就设置了一个固定的值,属性MiniNum也是一样的,那么在运行时就会出现以下错误:

    修改错误的方法是:
             在 slider1_ValueChanged 的代码里加一句:slider.Value=你设置的那个值、slider1.Minimum=你设置的那个值,这样就OK了,一般情况的话就不要在XAML中设置Value、MiniNum属性了,拿Slider控件这个错误没办法。。。
    (2)创建事件有两种方法:
            一种是在XAML中实现,是我自己现在经常用的,因为比较容易理解,简单点。还以Slider控件为例:在其XAML页面设置为ValueChanged="slider1_ValueChanged" 然后双击在其MainPage.xaml.cs后台代码页面中出现

    private void slider1_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
    { 
    //.... }

            另一种是在托管代码中实现。例如:

    public partial class MainPage : PhoneApplicationPage
    {
       // 构造函数
        public MainPage()
        {
           InitializeComponent();
           //托管代码
           this.slider1.ValueChanged+=new RoutedPropertyChangedEventHandler<double>(slider1_ValueChanged);
        }
        private void slider1_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
        {
           //其他代码 
        }
    }

    小技巧:写托管代码时,敲出 slider1.ValueChanged += 后,按下空格键,就会直接给出后面的代码
    new RoutedPropertyChangedEventHandler<double>(slider1_ValueChanged) 的提示信息,然后按Tab键两下,就完成托管代码了。
    4、布局与界面
    (1)Canvas -- 画布
          Canvas是依据坐标X轴和Y轴进行定位,设置属性为:Canvas.Left(X轴)和Canvas.Top(Y轴),另外,可以使用Z轴定位实现元素的三维重叠效果,属性为:Canvas.ZIndex,属性值越大元素越在上层。
    (2)Grid -- 网格
           使用一张网格将XAML元素按格进行定位,使用Grid.RowDefinitions定义行,使用Grid.ColumnDefinitions定义列。
    小技巧:需要设置网格的多少以及行列的宽度、高度时,直接用鼠标点击Grid的边框,随意设置即可。
    (3)StackPanel -- 容器(堆栈面板)
           相对于Canvas和Grid,StackPanel使用更加简单、方便,可以直接将XAML元素按行或列整齐的顺序性的进行排列,有从左到右、从上到下两种排列方式,其属性设置为:Orientation="Horizontal"或"Vertical",默认为Vertical。其实StackPanel就是 堆栈 的容器,如果了解数据结构中的堆栈的话,就很好理解了。
    (4)Panorama -- 全景视图
            Panorama将一部分内容显示出来,剩下的六道第二屏、第三屏显示。
     全景视图最佳实践:
            1> 背景图片大小高度800,宽度大于480小于2000,一般选择宽、高为480*800或8000*1024px的png图片,png图片失真小、图片质量高、能够正确反映整个程序意义。
            2>Item尽量不要多于4个。
            3>不要再其中放置水平滑动的控件,例如水平的ScrollViewer。
            4>不要使用Panorama做任务流程。
    (5)Pivot -- 枢轴
            Pivot控件分为两大结构: Pivot Headers 和 Pivot item Control,其中 Pivot item Control 是整个Pivot控件的核心显示区域。
              枢轴视图最佳实践:
                1>每个Pivot中的PivotItem尽量不要超过7个
                2>避免空白Pivot页
                3>不要在其中放置水平滑动的控件,例如水平的ScrollViewer
                4>标题文字简洁、高度固定
                5> PivotItem显示同类型的数据
                6> 不能用Pivot页面做任务流程
                7> PivotItem宽度不能超过屏幕
    Pivot与Panorama的区别如下:

    (6)ApplicationBar -- 菜单
            分为两大结构:ApplicationBarIconButton ApplicationBarMenuItem
            ApplicationBarIconButton 最多支持4个 Button;居中显示;图标大小48*48px;一般不用GoBack。
            常用属性:IsVisibleIsMenuEnabledOpacity
        **图标位于:C:\\Program Files\Microsoft SDKs\Windows Phone v7.0\Icons\dar 文件夹中
           ApplicationBarMenuItem 尽量避免超过5项;避免过长文字;文字自动切换为小写
    (7)还有一个是System Tray,在屏幕的最上面
          显示信号强度、数据连接、漫游、无线网络信号强度、铃声,模式、电池电量之类的

           

    主要属性是:IsVisible、Opacity、BackgroundColor & ForegroundColor

    后记--关于wp的一些很基础的东西,代码很少,先把理论弄明白了以后再深入实践,是给我自己积累的,也拿出来给friends分享下。。。

  • 相关阅读:
    Parameter 'xxx' not found. Available parameters are
    Windows下Redis开机自启动
    异常:找不到文件/无法解析
    远程连接MySQL数据库配置
    调用微信jssdk失败
    css+div 高度满屏
    常用JS正则表达式
    AVL树
    红黑树
    微信小程序实现自定义modal弹窗封装的方法
  • 原文地址:https://www.cnblogs.com/kefira/p/wp7.html
Copyright © 2020-2023  润新知