WPF学习(二)布局与菜单、工具栏

时间:2023-12-11 10:01:26

布局

//表格
①Grid
//3列 4行的表格  
<Grid>
    <Grid.ColumDefinitions>    
        <ColumnDefintion> </ColumnDefintion>     //ColumDefinitions列
        <ColumnDefintion> </ColumnDefintion>
        <ColumnDefintion> </ColumnDefintion>
    </Grid.ColumDefinitions>
   
    <Grid.RowDefinitions>
        <RowDefinition>  </RowDefiniton>      //RowDefinitions行
        <RowDefinition>  </RowDefiniton>
        <RowDefinition>  </RowDefiniton>
        <RowDefinition>  </RowDefiniton>
    </Grid.RowDefinitions>
    <Button Grid.Row="1" Grid.Column="1"></Button>  //将按钮放置在第一行第一列
   
    //将按钮放置在第3行第0列并且 占两列
    <Image Soruce="1.jpg" Grid.Row="3" Grid.Column="0" Grid.ColumnSpan="2"></Image>  
    
</Grid>

//子元素横向或纵向排列
②StackPanel:Orientation="Vertical"(默认纵向)“Horizontal”横向
//按钮以图片显示
<Button>
    <Button.Content>
          <Image Source="1.jpg"/>
    </Button.Content>
</Button>

//按钮以图片和文字形式显示   //属性VerticalAlignment:垂直对齐方式
<Button>
    <Button.Content>
          <StackPanel>
              <Image Source="1.jpg"/> 
              <TextBlock VerticalAlignment="Center" Text="确定"/>
          </StackPanel>         
    </Button.Content>
</Button>

//子元素靠上下左右
③DockPanel

<DockPanel>
    <Menu DockPanel.Dock="Top"></Menu>
</DockPanel>

菜单、工具栏

Menu:普通菜单

<Menu>
  <MenuItem Header="文件">
      <MenuItem Header="打开"></MenuItem>
      <MenuItem Header="关闭"></MenuItem>
  </MenuItem>
  <MenuItem Header="编辑"></MenuItem>
</Menu>

ContextMenu:右键菜单

ToolBar  :工具栏控件

<DockPanel>
  <ToolBar DockPanel.Dock="Top">
      <Button Conent="保存"></Button>
  </ToolBar>
</DockPanel>