• [Winodows Phone 7控件详解]容器控件


    在Windows Phone7中存在着多个容器控件,这些控件主要是用来界面的布局设置,以及包容多个控件时的布局设置。

    一.Grid控件:主要用于界面的布局,这个和web page里的很相似,可以通过网格布置规划界面,也可以嵌套使用。

    <Grid x:Name="LayoutRoot" Background="#DCDCDC" Width="400" Height="300" ShowGridLines="True">
    <Grid.ColumnDefinitions>
    <ColumnDefinition Width="250" />
    <ColumnDefinition Width="150" />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
    <RowDefinition Height="Auto" />
    <RowDefinition Height="2*" />
    <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <TextBlock Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2" Margin="10" FontWeight="Bold" Text="Contoso Corporation" HorizontalAlignment="Center" VerticalAlignment="Center" />
    <Grid x:Name="FormLayoutGrid" Grid.Row="1" Grid.Column="0" ShowGridLines="True">
    <Grid.ColumnDefinitions>
    <ColumnDefinition Width="Auto" />
    <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
    <RowDefinition Height="*" />
    <RowDefinition Height="*" />
    <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <TextBlock Grid.Row="0" Grid.Column="0" Text="First Name" Margin="10" HorizontalAlignment="Left" VerticalAlignment="Center" />
    <TextBox Grid.Row="0" Grid.Column="1" Margin="10" />
    <TextBlock Grid.Row="1" Grid.Column="0" Text="Last Name" Margin="10" HorizontalAlignment="Left" VerticalAlignment="Center" />
    <TextBox Grid.Row="1" Grid.Column="1" Margin="10" />
    <TextBlock Grid.Row="2" Grid.Column="0" Text="Address" Margin="10" HorizontalAlignment="Left" VerticalAlignment="Center" />
    <TextBox Grid.Row="2" Grid.Column="1" Margin="10" />

    </Grid>
    </Grid>

    二.Canvas控件  容器、布局控件,主要是用绝对坐标来定位子控件。对于游戏开发来说用处很大。

    <Canvas x:Name="C1"  Grid.Row="2">
    <CheckBox x:Name="CheckBox3" Content="CheckBox3" Canvas.Top="50" Canvas.Left="100" Canvas.ZIndex="1" />
    </Canvas>

    也可以使用代码来控制

    Canvas.SetLeft();
    Canvas.SetTop();
    Canvas.SetZIndex();//控制子控件在Z轴上的顺序。

    三.StackPanel控件容器、布局控件,主要用来多个子控件的纵向、横向的布局控制。

    <StackPanel x:Name="stackPanel1" Margin="20" Orientation="Vertical" >
    <Rectangle Fill="Red" Width="50" Height="50" Margin="5" />
    <Rectangle Fill="Blue" Width="50" Height="50" Margin="5" />
    <Rectangle Fill="Green" Width="50" Height="50" Margin="5" />
    <Rectangle Fill="Purple" Width="50" Height="50" Margin="5" />
    </StackPanel>

    可以使用下面的方法向上面的StackPanel中动态插入一个Rectangle

    private void button1_Click(object sender, RoutedEventArgs e)
    {
    Rectangle rect = new Rectangle() { Fill = new SolidColorBrush(Colors.Yellow),Width=50,Height=50};
    stackPanel1.Children.Insert(2, rect);
    }

    四.Border控件: 用于包容一个控件并为其绘制边框,并且通过参数设置可以产生多种不同的边框效果。(不太应该算为容器控件,但是又觉得放在别的类里又不是很合适。Jake Lin 和李振都这么分,我采纳了这个观点)

    <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,12">
    <Border Background="Coral" Width="300" Height="40" Padding="10" CornerRadius="20">
    <TextBlock FontSize="16">Text Surrounded by a Border</TextBlock>
    </Border>
    <Border x:Name="b1" Width="200" Height="200" Background="Gold" BorderBrush="Aquamarine" BorderThickness="10, 5, 20, 40" Margin="119,346,137,49" CornerRadius="25, 200, 10, 15" >
    <TextBox Height="67" Name="textBox1" Text="Test Border" Background="Gold" Foreground="White" BorderBrush="Gold" Width="170" VerticalAlignment="Bottom"/>
    </Border>
    </Grid>

    BorderThickness:边框宽度,设置不同的值使四个边产生不同的宽度。

    CornerRadius:边角半径,设置不同的值四个边角产生不同的弧度。

    五.PopUp控件:严格来讲这个不应该算作容器控件,但是它可以把包含在其中的控件显示在当前页的最前面,可以被打开和关闭。可以用来制作自定义的MessageBox、WaitingBox等。

            <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,36,132">
    <Image Source="Images/1.jpg" Height="426" HorizontalAlignment="Left" Margin="25,25,0,0" Name="image1" Stretch="Fill" VerticalAlignment="Top" Width="386" />
    <!-- 这个容器可以被打开和关闭 -->
    <Popup IsOpen="True" HorizontalAlignment="Left" Margin="92,106,0,0" Name="popup1" VerticalAlignment="Top" Height="250" Width="250" >
    <Canvas Width="250" Height="250" Background="Red" VerticalAlignment="Center" HorizontalAlignment="Center">
    <TextBlock Margin="30,120,0,0" Text="我在当前页面的上层"/>
    </Canvas>
    </Popup>
    </Grid>
    <Button Content="打开" Grid.Row="1" Height="72" HorizontalAlignment="Left" Margin="64,523,0,0" Name="btnOpen" VerticalAlignment="Top" Width="160" Click="btnOpen_Click" />
    <Button Content="关闭" Height="72" HorizontalAlignment="Left" Margin="230,523,0,0" Name="btnClose" VerticalAlignment="Top" Width="160" Grid.Row="1" Click="btnClose_Click" />
    </Grid>

    六.ScrollView:  滚动查看器控件,也算是一个容器控件,它可以用来拖动显示其所包含的控件的内容。

            <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
    <Canvas>
    <!-- A large TextBlock. -->
    <!-- A large TextBlock. -->
    <TextBlock Canvas.Top="60" Canvas.Left="-50" Width="400" TextWrapping="Wrap"
    Text="I am the very model of a modern Major-General, I've information vegetable, animal, and mineral, I know the kings of England, and I quote the fights historical, From Marathon to Waterloo, in order categorical; I'm very well acquainted, too, with matters mathematical, I understand equations, both the simple and quadratical, About binomial theorem I'm teeming with a lot o' news, With many cheerful facts about the square of the hypotenuse." Margin="78,0,78,201" />

    <!-- The same large TextBlock, wrapped in a ScrollViewer. -->
    <!-- It can be scrolled in either direction, since VerticalScrollBarVisibility -->
    <!-- has a default value of Visible. -->

    <ScrollViewer BorderBrush="Green" BorderThickness="5" Height="200" Width="300" HorizontalScrollBarVisibility="Auto" Canvas.Top="400" Canvas.Left="80">
    <TextBlock Width="300" TextWrapping="Wrap"
    Text="I am the very model of a modern Major-General, I've information vegetable, animal, and mineral, I know the kings of England, and I quote the fights historical, From Marathon to Waterloo, in order categorical; I'm very well acquainted, too, with matters mathematical, I understand equations, both the simple and quadratical, About binomial theorem I'm teeming with a lot o' news, With many cheerful facts about the square of the hypotenuse." />
    </ScrollViewer>
    </Canvas>
    </Grid>

  • 相关阅读:
    轻量级分布式任务调度框架(二、LTS编译、打包、部署)
    轻量级分布式任务调度框架(一、LTS简介、特点、工作流程)
    MySQL数据库学习一
    Navicat 连接 SQL Server 数据库,报错 08001
    noVNC 遇到一个错误: Uncaught TypeError: Cannot read property 'forEach' of undefined
    加强自己VPS服务器安全的一次经历
    Python 编码错误的本质和解决方案
    You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near 'data' at line 1
    requests爬虫请求报错:UnicodeEncodeError: 'latin-1' codec can't encode character 'u2026' in position 30
    docker无法删除镜像,Error: No such container,附docker常用命令
  • 原文地址:https://www.cnblogs.com/DebugLZQ/p/2422391.html
Copyright © 2020-2023  润新知