WPF入门教程详解3——Grid、StackPanel、DockPanel、WrapPanel、Canvas、Calendar、Image、文字内嵌图片、ProgressBar、Rectangle

123梦野

已于 2023-01-30 17:41:37 修改

阅读量381

点赞数

分类专栏： WPF 文章标签： wpf

于 2023-01-23 12:31:57 首次发布

本文链接：https://blog.csdn.net/qq_42832272/article/details/128751965

版权

WPF 专栏收录该内容

29 篇文章 14 订阅

订阅专栏

Grid

在这里插入图片描述

 <Grid.RowDefinitions>
            <RowDefinition Height="100"/>
            <RowDefinition Height="200"/>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
        </Grid.RowDefinitions>

StackPanel

在这里插入图片描述

<StackPanel Orientation="Vertical" Opacity="0.5">
            <Label Width="180" Height="30" Content="label control"
                   VerticalAlignment="Top" Margin="0,10" FontSize="18" Foreground="Black"/>
            <Label Width="180" Height="30" Content="label control1"
                   VerticalAlignment="Top" Margin="0,10" FontSize="18" Foreground="Blue"/>
        </StackPanel>

DockPanel

在这里插入图片描述

        <DockPanel Background="Beige" LastChildFill="True">
            <DockPanel DockPanel.Dock="Left" Background="Red" Width="50" />
            <DockPanel DockPanel.Dock="Left" Background="Red" Width="50" />
            <DockPanel DockPanel.Dock="Left" Background="Red" Width="50" />
            <DockPanel DockPanel.Dock="Left" Background="Green" Width="200" />
        </DockPanel>

WrapPanel

在这里插入图片描述

                <WrapPanel Width="700" Orientation="Vertical">
            <StackPanel Width="300" Height="100" Background="Teal"/>
            <StackPanel Width="300" Height="100" Background="Teal" Orientation="Vertical"/>
        </WrapPanel>

Canvas

在这里插入图片描述

        <Canvas Width ="500" Height="500">
            <StackPanel Width="100" Height="100" Background="Red" Canvas.Top="50" Canvas.Left="200"></StackPanel>
            <StackPanel Width="100" Height="100" Background="Green" Canvas.Top="250" Canvas.Left="200"/>
            <StackPanel Width="100" Height="100" Background="Yellow" Canvas.Top="150" Canvas.Left="95"/>
            <WrapPanel Width="100" Height="100" Background="Black" Canvas.Top="150" Canvas.Left="305"/>
            <WrapPanel Width="100" Height="100" Background="Purple" Canvas.Bottom="80" Canvas.Right="80"/>
        </Canvas>

Calendar

在这里插入图片描述

       <Calendar SelectionMode="MultipleRange" DisplayDate="2022-01-01" SelectedDate="2022-01-01"
                DisplayDateStart="2022-01-01" DisplayDateEnd="2022-03-01">
        </Calendar>