【WP开发学习笔记】之pivot控件

博主wp开发小白,学习中...欢迎交流,微博@马and康

pivot控件中文也称为枢纽,是wp系统中最常用的控件之一,几乎所有个软件多多少少都会运用这个控件,比如设置、日历等等;该控件可以实现页面左右的快速切换,运行也十分流畅。如在设置中通过左右滑动可以切换为应用程序、系统,日历中通过左右滑动可以切换年、月、日;

首先可以通过项目模板直接建立一个pivot应用程序,或者通过拖动工具箱中的pivot控件,当然也可以直接通过xaml代码来直接写出来,这一点就不多说了;

我在用pivot控件时遇到的第一个问题就是更改PivotItem字体以及字体大小的问题,因为默认的字体实在太大,如果直接用默认字体写的话,效果的确很丑,就像wp系统部分内置应用的大写字体,简直给人老人机的感觉;

其修改字体代码如下;

            <phone:PivotItem>
                <phone:PivotItem.Header>
                    <TextBlock Text="星期一" FontSize="40" FontFamily="宋体”/>
                </phone:PivotItem.Header>
            </phone:PivotItem>            

我运用Pivot控件写了一个课程表;
其中Pivot效果(尚未完工)如下;

填写完星期一的课程内容后效果如下,其星期二至星期日的课表尚未完成;

完整源代码如下;

<phone:PhoneApplicationPage
    x:Class="Pivot.MainPage"
    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"
    mc:Ignorable="d"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait" Orientation="Portrait"
    shell:SystemTray.IsVisible="True">
    <Grid >
        <phone:Pivot Title="我的课程表">
            <phone:PivotItem>
                <phone:PivotItem.Header>
                    <TextBlock Text="星期一" FontSize="40"/>
                </phone:PivotItem.Header>
                <Grid ShowGridLines="True">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="auto"/>
                        <ColumnDefinition Width="auto"/>
                    </Grid.ColumnDefinitions>
                    <TextBlock Grid.Row="0" Grid.Column="0" Grid.RowSpan="2" Text="上午" VerticalAlignment="Center" FontSize="30"/>
                    <TextBlock Grid.Row="2" Grid.Column="0" Grid.RowSpan="2" Text="下午" VerticalAlignment="Center" FontSize="30"/>
                    <TextBlock Grid.Row="4" Grid.Column="0" Grid.RowSpan="2" Text="自习" VerticalAlignment="Center" FontSize="30"/>
                    <StackPanel  Grid.Row="0" Grid.Column="1" Orientation="Horizontal" >
                        <TextBlock Text="08;00-09;30" FontSize="30" VerticalAlignment="Center"/>
                        <TextBlock Text="管理会计" FontSize="30" VerticalAlignment="Center"/>
                    </StackPanel>
                    <StackPanel Grid.Row="1" Grid.Column="1" Orientation="Horizontal">
                        <TextBlock Text="10;00-11;30" FontSize="30" VerticalAlignment="Center"/>
                        <TextBlock Text="财政与税收" FontSize="30" VerticalAlignment="Center"/>
                    </StackPanel>
                    <StackPanel  Grid.Row="2" Grid.Column="1" Orientation="Horizontal" >
                        <TextBlock Text="14;00-15;30" FontSize="30" VerticalAlignment="Center"/>
                        <TextBlock Text="经济法" FontSize="30" VerticalAlignment="Center"/>
                    </StackPanel>
                    <StackPanel Grid.Row="3" Grid.Column="1" Orientation="Horizontal">
                        <TextBlock Text="16;00-17;30" FontSize="30" VerticalAlignment="Center"/>
                        <TextBlock Text="会计信息系统" FontSize="30" VerticalAlignment="Center"/>
                    </StackPanel>
                    <StackPanel  Grid.Row="4" Grid.Column="1" Orientation="Horizontal" >
                        <TextBlock Text="18;30-20;00" FontSize="30" VerticalAlignment="Center"/>
                        <TextBlock Text="会计理论" FontSize="30" VerticalAlignment="Center"/>
                    </StackPanel>
                    <StackPanel Grid.Row="5" Grid.Column="1" Orientation="Horizontal">
                        <TextBlock Text="20;00-21;30" FontSize="30" VerticalAlignment="Center"/>
                        <TextBlock Text="统计学" FontSize="30" VerticalAlignment="Center"/>
                    </StackPanel>
                </Grid>
            </phone:PivotItem>
            <phone:PivotItem >
                <phone:PivotItem.Header>
                    <TextBlock Text="星期二" FontSize="40"/>
                </phone:PivotItem.Header>
                <Grid ShowGridLines="True">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="auto"/>
                        <ColumnDefinition Width="auto"/>
                    </Grid.ColumnDefinitions>
                    <TextBlock Grid.Row="0" Grid.Column="0" Grid.RowSpan="2" Text="上午" VerticalAlignment="Center" FontSize="30"/>
                    <TextBlock Grid.Row="2" Grid.Column="0" Grid.RowSpan="2" Text="下午" VerticalAlignment="Center" FontSize="30"/>
                    <TextBlock Grid.Row="4" Grid.Column="0" Grid.RowSpan="2" Text="自习" VerticalAlignment="Center" FontSize="30"/>
                </Grid>
            </phone:PivotItem>
            <phone:PivotItem>
                <phone:PivotItem.Header>
                    <TextBlock Text="星期三" FontSize="40"/>
                </phone:PivotItem.Header>
                <Grid ShowGridLines="True">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="auto"/>
                        <ColumnDefinition Width="auto"/>
                    </Grid.ColumnDefinitions>
                    <TextBlock Grid.Row="0" Grid.Column="0" Grid.RowSpan="2" Text="上午" VerticalAlignment="Center" FontSize="30"/>
                    <TextBlock Grid.Row="2" Grid.Column="0" Grid.RowSpan="2" Text="下午" VerticalAlignment="Center" FontSize="30"/>
                    <TextBlock Grid.Row="4" Grid.Column="0" Grid.RowSpan="2" Text="自习" VerticalAlignment="Center" FontSize="30"/>
                </Grid>
            </phone:PivotItem>
            <phone:PivotItem>
                <phone:PivotItem.Header>
                    <TextBlock Text="星期四" FontSize="40"/>
                </phone:PivotItem.Header>
                <Grid ShowGridLines="True">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="auto"/>
                        <ColumnDefinition Width="auto"/>
                    </Grid.ColumnDefinitions>
                    <TextBlock Grid.Row="0" Grid.Column="0" Grid.RowSpan="2" Text="上午" VerticalAlignment="Center" FontSize="30"/>
                    <TextBlock Grid.Row="2" Grid.Column="0" Grid.RowSpan="2" Text="下午" VerticalAlignment="Center" FontSize="30"/>
                    <TextBlock Grid.Row="4" Grid.Column="0" Grid.RowSpan="2" Text="自习" VerticalAlignment="Center" FontSize="30"/>
                </Grid>
            </phone:PivotItem>
            <phone:PivotItem >
                <phone:PivotItem.Header>
                    <TextBlock Text="星期五" FontSize="40"/>
                </phone:PivotItem.Header>
                <Grid ShowGridLines="True">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="auto"/>
                        <ColumnDefinition Width="auto"/>
                    </Grid.ColumnDefinitions>
                    <TextBlock Grid.Row="0" Grid.Column="0" Grid.RowSpan="2" Text="上午" VerticalAlignment="Center" FontSize="30"/>
                    <TextBlock Grid.Row="2" Grid.Column="0" Grid.RowSpan="2" Text="下午" VerticalAlignment="Center" FontSize="30"/>
                    <TextBlock Grid.Row="4" Grid.Column="0" Grid.RowSpan="2" Text="自习" VerticalAlignment="Center" FontSize="30"/>
                </Grid>
            </phone:PivotItem>
            <phone:PivotItem >
                <phone:PivotItem.Header>
                    <TextBlock Text="星期六" FontSize="40"/>
                </phone:PivotItem.Header>
                <Grid ShowGridLines="True">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="auto"/>
                        <ColumnDefinition Width="auto"/>
                    </Grid.ColumnDefinitions>
                    <TextBlock Grid.Row="0" Grid.Column="0" Grid.RowSpan="2" Text="上午" VerticalAlignment="Center" FontSize="30"/>
                    <TextBlock Grid.Row="2" Grid.Column="0" Grid.RowSpan="2" Text="下午" VerticalAlignment="Center" FontSize="30"/>
                    <TextBlock Grid.Row="4" Grid.Column="0" Grid.RowSpan="2" Text="自习" VerticalAlignment="Center" FontSize="30"/>
                </Grid>
            </phone:PivotItem>
            <phone:PivotItem >
                <phone:PivotItem.Header >
                    <TextBlock Text="星期日" FontSize="40"/>
                </phone:PivotItem.Header>
                <Grid ShowGridLines="True">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="auto"/>
                        <ColumnDefinition Width="auto"/>
                    </Grid.ColumnDefinitions>
                    <TextBlock Grid.Row="0" Grid.Column="0" Grid.RowSpan="2" Text="上午" VerticalAlignment="Center" FontSize="30"/>
                    <TextBlock Grid.Row="2" Grid.Column="0" Grid.RowSpan="2" Text="下午" VerticalAlignment="Center" FontSize="30"/>
                    <TextBlock Grid.Row="4" Grid.Column="0" Grid.RowSpan="2" Text="自习" VerticalAlignment="Center" FontSize="30"/>
                </Grid>
            </phone:PivotItem>
        </phone:Pivot>
    </Grid>
</phone:PhoneApplicationPage>  
时间: 2024-08-01 16:41:47

【WP开发学习笔记】之pivot控件的相关文章

Android开发学习笔记-自定义组合控件的过程

自定义组合控件的过程 1.自定义一个View 一般来说,继承相对布局,或者线性布局 ViewGroup:2.实现父类的构造方法.一般来说,需要在构造方法里初始化自定义的布局文件:3.根据一些需要或者需求,定义一些API方法: ----------------------------------4.根据需要,自定义控件的属性,可以参照TextView属性: 5.自定义命名空间,例如: xmlns:itheima="http://schemas.android.com/apk/res/<包名&

Android开发学习笔记-自定义组合控件

为了能让代码能够更多的复用,故使用组合控件.下面是我正在写的项目中用到的方法. 1.先写要组合的一些需要的控件,将其封装到一个布局xml布局文件中. <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="

Android学习笔记:常用控件 RadioGroup和CheckBox

RadioGroup和CheckBox是android的常用控件,本文自做简单介绍和学习笔记,所以所用的控件样式选用android默认的样式. 先看下代码实现的效果图 图中,上面两个(male和female)为一个RadioGroup中的两个RadioButton,下面三个为CheckBox. 一个RadioGroup里面的内容只可单选,CheckBox可多选. 接下来是代码部分 布局文件代码activity_main.xml : <LinearLayout xmlns:android="

【WP开发学习笔记】之样式(style)

今天练习控件时第一次见到style(样式),通过设置style可以大幅提高用xaml写UI的效率: 我在之前的学习中,每写一个控件就要写出与之匹配的一大堆属性,比如每次写一个button就要写一个background,一个foreground,一个width,一个height.一个fontsize.一个fontfamily,一个margin等等,有时需要写出一大推button时就必须把上面的属性在重复写n次,写其他控件时也是这样,这样相当麻烦.而今天刚刚看到的样式(style)就能很好的解决这个

【ExtAspNet学习笔记】ExtAspNet控件库中常见问题

1.在Grid控件中添加CheckBoxField控件,选择一行时,如何获取选择的CheckBoxField所对应记录的唯一标识值? ●解决方案: 在前台Grid控件中, 添加“<ext:CheckBoxField ColumnId="myCheckBoxField" Width="60px" RenderAsStaticField="false"  DataField="MyCheckBox" CommandName=

【学习笔记】Android控件的使用

一.Spinner 1)在布局文件中添加一个Spinner控件后,在MainActivity中定义了Spinner后,需要设置适配器 2)为了知道我们选择了哪个选项,需要进行监听.里面的position代表数组中选择的下标

android学习笔记(2)EditText控件的学习

对应若水老师的第五课 一,设置一个输入框 添加控件: <EditText android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginTop="52dp" <!--本控件顶部距离上一个控件的距离--> /> 二,消除输入框的聚焦 方法一: <EditText android:layout_wi

PyQt5学习笔记04----Qt Designer控件的通用属性

在Qt Designer中的右边为我们提供了窗体.控件.布局的属性编辑功能. 比较常用的有: objectName 控件对象名称 例:quitButton= QtWidgets.QPushButton() 等号前面的那个名字 geometry 相对坐标系 sizePolicy 控件大小策略 minimumSize最小宽度.高度 maximumSize最大宽度.高度  如果想让窗体或控件固定大小,可以将mini和max这两个属性设置成一样的数值 font 字体 cursor 光标 windowTi

Framework7新版学习笔记之 开关控件

一:开关控件 新版F7增加了开关控件,在界面中提供一个开关按钮,点击它进行 打开/关闭. 二:定义开关控件并自动初始化 <label class="toggle color-xx toggle-init"> <input type="checkbox"> <span class="toggle-icon"></span> </label> 三:在js中获取开关值 var toggle =