zoukankan      html  css  js  c++  java
  • 【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>  
  • 相关阅读:
    [vue]vue路由篇vue-router
    [vue]spa单页开发及vue-router基础
    [css]table的拆分
    [sh]md5sum接变量,find排除,sh判断文件存在
    [vue]通过watch实现数据双向绑定
    [django]form不清空问题解决
    [vue]实现父子组件数据双向绑定
    springboot2.0 如何异步操作,@Async失效,无法进入异步
    kafka搭建笔记
    Springboot2.x+shiro+redis(Lettuce)整合填坑
  • 原文地址:https://www.cnblogs.com/kangma/p/3996251.html
Copyright © 2011-2022 走看看