WPF开发笔记：布局

移动开发 2023-08-01 17:19:18 阅读次数: 0

五、布局

1.StackPanel WrapPanel DockPanel

StackPanel
<!--排列成一行或一列 StackPanel 默认排列方向 ：垂直 水平：高度与父窗口的高度相同
子元素超出部分会被隐藏-->
<!--<StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
    <Button>按钮1</Button>
    <Button Margin="10,0,10,0">按钮2</Button>
    <Button>按钮3</Button>
</StackPanel>-->
<StackPanel Orientation="Horizontal" VerticalAlignment="Center" FlowDirection="RightToLeft">
    <Button>按钮1</Button>
    <Button Margin="10,0,10,0">按钮2</Button>
    <Button>按钮3</Button>
</StackPanel>
WrapPanel

子元素按顺序排列，如果水平方向：从左到右，超出部分，自动换行到下一行

 <!-- 调整面板尺寸，内部子元素的布局自动调整  弥补stackPanel不足，与wrapPanel结合使用   border Margin="20"-->
<Border BorderBrush="Red" BorderThickness="3" CornerRadius="15" >
    <StackPanel>
        <WrapPanel Name="wpPanel2" Margin="0,0,0,20">

        </WrapPanel>
        <WrapPanel  Name="wpPanel" Orientation="Vertical"   ItemHeight="30" ItemWidth="90" Height="300">
            <!--<Button>button1</Button>
        <Button>button2</Button>
        <Button>button3</Button>
        <Button>button4</Button>-->
        </WrapPanel>
    </StackPanel>
</Border>

//动态添加按钮到 WrapPanel
private void Window_Loaded(object sender, RoutedEventArgs e)
{
    for(int i=1;i<=20;i++)
    {
        Button btn = new Button();
        btn.Content = "btn" + i.ToString("00") + "号";
        btn.Background = new SolidColorBrush(Colors.Transparent);
        btn.Name = "btn" + i;
        btn.Margin = new Thickness(10, 5, 0, 0);
        wpPanel.Children.Add(btn);
    }
    for (int i = 1; i <= 10; i++)
    {
        Button btn = new Button();
        btn.Content = "btn" + i.ToString("00") + "号";
        btn.Background = new SolidColorBrush(Colors.Transparent);
        //btn.Name = "btn" + i;
        btn.Margin = new Thickness(10, 5, 0, 0);
        wpPanel2.Children.Add(btn);
    }
}
DockPanel

停靠面板 顶部， 左边，右边 中间 winform Dock:Top Left Right Buttom

与其他布局控件结合使用

在这里插入图片描述

<!--先添加的子元素，优先占用边角-->
<Grid>
    <!--LastChildFill="False" 最后一个子元素是否填充-->
    <DockPanel LastChildFill="True">
        <StackPanel Height="50" Background="Aquamarine" DockPanel.Dock="Top">
            <Label Content="Top"/>
        </StackPanel>
        <StackPanel DockPanel.Dock="Bottom" Background="LightPink" Height="30"/>
        <StackPanel DockPanel.Dock="Left" Background="Lavender" Width="100"/>
        <StackPanel DockPanel.Dock="Right" Background="Tan" Width="100"/>
        <Grid Background="Cornsilk" >
            <Label Content="GridContent"></Label>
        </Grid>
        <Grid Background="Salmon" >
            <DockPanel LastChildFill="True">
                <!-- <Button Content="right" />最后元素-->
                <Button Content="Top" Height="30" DockPanel.Dock="Top"/>
                <Button Content="botton" Height="30" DockPanel.Dock="Bottom"/>
                <Button Content="Left" Width="30" DockPanel.Dock="Left"/>
                <Button Content="right" />
            </DockPanel>
           
        </Grid>
    </DockPanel>
</Grid>

2.Canvas Grid GroupBox

Canvas

画布面板（坐标面板）定义区域，子元素显示位置，指定相对于面板的坐标，来定位子元素位置。

附加属性：Canvas.left Canvas.Right Canvas.top Canvas.Bottom

坐标：(left,top) (letf,bottom) (right,top) (right,bottom)

<!--ClipToBound false 默认值 如果溢出，就显示在外边，true 裁剪-->
<Grid>
    <Canvas>
        <Button Content="button1" Width="80" Height="40" Canvas.Left="20" Canvas.Top="30"/>
        <Button Content="button2" Width="80" Height="40" Canvas.Left="20" Canvas.Bottom="30"/>
        <Button Content="button3" Width="80" Height="40" Canvas.Right="20" Canvas.Top="30"/>
        <Button Content="button4" Width="80" Height="40" Canvas.Right="20" Canvas.Bottom="30"/>
        <!-- 重叠效果，优先显示：后添加的元素显示在上面-如果要改变默认优先级： Panel.ZIndex默认值0，改变优先显示顺序 Panel.ZIndex 值越大，
        就显示最上面 ，Panel.ZIndex 值相同 ，后添加的显示在上面-->
        <Button Content="button6" Width="80" Height="40" Canvas.Left="50" Canvas.Top="150" Panel.ZIndex="2"/>
        <Button Content="button7" Width="80" Height="40" Canvas.Left="52" Canvas.Top="150"/>
        <Button Content="button8" Width="80" Height="40" Canvas.Left="58" Canvas.Top="150"/>
    </Canvas>
</Grid>
Grid

Grid:网格面板，类似Winform 中TableLayoutPanel 行和列方式布局页面或页面中某一块区域

单元格 一个或多个元素，容器：多个控件stackPanel/WrapPanel/Grid等

指定元素位置： Row Column RowSpan ColumnSpan

Grid 是最复杂一种布局，很强大，很灵活的布局控件

扫描二维码关注公众号，回复： 15995663 查看本文章

在这里插入图片描述

<Grid ShowGridLines="True" Background="AliceBlue">
    <!--定义Grid的行和列-->
    <!--尺寸3种：(1)固定 n (2) 按比例 n* 2n*  auto 按内容自动分配
    (3) 没有设置 height width，平均分配-->
    <Grid.RowDefinitions>
        <RowDefinition Height="30"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="2*"/>
        <RowDefinition Height="auto"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition/>
        <ColumnDefinition/>
    </Grid.ColumnDefinitions>
    <!--元素位置的指定 指定该元素的所在的行索引和列索引，从0开始，如果没有指定，默认就是第一个单元格 0，0 Row column 跨行或跨列Rowspan ColumnSpan-->
        <TextBox Grid.Column="1"></TextBox>
        <TextBlock Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="2" Background="LavenderBlush"/>
        <Label Grid.Row="0" Grid.Column="0" Grid.RowSpan="2" Background="YellowGreen" Content="用户信息"/>
        <Label Grid.Row="3" Grid.Column="1" Content="用户名:" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="84,0,0,0"/>
    <Label Grid.Row="3" Grid.Column="1" Content="密码:" HorizontalAlignment="Left" VerticalAlignment="Top"/>
    <WrapPanel Grid.Column="1" Grid.Row="2" Background="Beige" ItemHeight="30" ItemWidth="40">
        <Button Content="btn1"/>
        <Button Content="btn1"/>
        <Button Content="btn1"/>
        <Button Content="btn1"/>
        <Button Content="btn1"/>
        <Button Content="btn1"/>
        <Button Content="btn1"/>
        <Button Content="btn1"/>
    </WrapPanel>
    <Grid Grid.Column="2" Grid.Row="2" Background="Bisque">
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition />
            <RowDefinition/>
          
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
        <Button Content="btn22"/>
        <Button Content="btn23" Grid.Column="1"/>
        <StackPanel Grid.Column="0" Grid.Row="1" Grid.ColumnSpan="2" Orientation="Horizontal" Background="LawnGreen">
            <Label Content="113"/>
            <Label Content="113"/>
            <Label Content="113"/>
            <Label Content="113"/>
        </StackPanel>
    </Grid>
</Grid>
GroupBox

在这里插入图片描述

<Grid>
    <!--分组控件 内容控件 只能有一个元素作为他的content
    如果想在内部呈现多个子元素，布局控件容纳-->
    <GroupBox Header="导航菜单" Width="200" Height="200" BorderThickness="2" BorderBrush="CadetBlue"
              VerticalAlignment="Top" HorizontalAlignment="Left">
        <StackPanel>
            <Label Content="这是一个Groupbox 控件"/>
            <Label Content="这是一个Groupbox 控件"/>
            <Label Content="这是一个Groupbox 控件"/>
            <Label Content="这是一个Groupbox 控件"/>
        </StackPanel>
    </GroupBox>
    <GroupBox Header="导航菜单2" Width="260" Height="200" BorderThickness="2" BorderBrush="SaddleBrown" 
              VerticalAlignment="Top" HorizontalAlignment="Left" Margin="282,10,0,0" Name="gbinfo">
        <StackPanel Orientation="Vertical" Name="spFirst">
            <StackPanel Orientation="Horizontal" Name="spUser">
                <Label Content="用户名："/>
                <TextBox Text="userName" Width="150"/>
            </StackPanel>
            <StackPanel Orientation="Horizontal" Margin="0,10,0,0">
                <Label Content="密码：" Margin="0,0,18,0"/>
                <TextBox Text="123456" Width="150"/>
            </StackPanel>
        </StackPanel>
    </GroupBox>
</Grid>

 private void Window_Loaded_1(object sender, RoutedEventArgs e)
{
    //如果没有设置TextBox的name 属性，通过GroupBox控件去获取
    StackPanel spFirst = gbinfo.Content as StackPanel;
    foreach(var ele in spFirst.Children)
    {
        StackPanel sp = ele as StackPanel;
        foreach(var ele2 in sp.Children)
        {
            if(ele2 is TextBox)
            {
                TextBox txt = ele2 as TextBox;
                string name = txt.Text;
            }
        }
    } 
}

3.Expander TabControl Frame

expander

折叠控件 IsExpand 默认隐藏内容

展开事件 Expanded 折叠事件Collapsed

<Grid>
    <!--IsExpand 默认隐藏内容-->
    <Expander Header="Expander" HorizontalAlignment="Left" Height="auto" Margin="263,189,0,0" VerticalAlignment="Top" 
              Padding="10" Width="240" ExpandDirection="Down" BorderThickness="2" >
        <StackPanel Background="Thistle">
            <CheckBox Content="管理员"/>
            <CheckBox Content="系统管理员"/>
            <CheckBox Content="业务员"/>
        </StackPanel>
    </Expander>
</Grid>
TabControl

选项卡集合的控件：多个共享相同的空间在屏幕上

<Grid>
   <TabControl Name="tabSystem"  TabStripPlacement="Left" VerticalAlignment="Top" Height="300" Width="500">
       <TabItem Header="用户信息">
           <Grid Background="Lavender">
               
           </Grid>
       </TabItem>
       <!--Tabltem  IsSelected="True"-->
       <TabItem Header="角色信息" IsSelected="True">
           <Grid Background="#FFE5E5EE">
               <Grid.ColumnDefinitions>
                   <ColumnDefinition Width="52*"/>
                   <ColumnDefinition Width="79*"/>
               </Grid.ColumnDefinitions>
           </Grid>
    
       </TabItem>
       <TabItem Header="权限设置">
           <Grid Background="SeaGreen"/>
       </TabItem>
   </TabControl>
   <Button Content="获取" HorizontalAlignment="Left" Margin="72,229,0,0" VerticalAlignment="Top" Click="Button_Click"/>
   <Button Content="切换" Name="btnChange" HorizontalAlignment="Left" Margin="94,300,0,0" VerticalAlignment="Top" RenderTransformOrigin="-0.102,0.145" Click="Button_Click_1"/>
</Grid>

 /// <summary>
 /// 依次切换
 /// </summary>
 /// <param name="sender"></param>
 /// <param name="e"></param>
 private void Button_Click_1(object sender, RoutedEventArgs e)
 {
     //tabSystem.SelectedItem = tabSystem.Items[2];
     if (tabSystem.SelectedIndex < tabSystem.Items.Count - 1)
         tabSystem.SelectedIndex += 1;
     else
         tabSystem.SelectedIndex = 0;
 }
Frame

Frame contentControl 支持导航，可以将一个页面导航到另一个页面，可承载Page页。

Tabltem ContentControl 直接在内部添加元素，布局成一个页面，直接将一个页面内嵌到TabItem.

Winform TabControl TabPage 将一个Form 内嵌到TabPage

Wpf中，Window 为根，内部不能是Window

<Grid>
     <!--直接在window中呈放一个Fram显示一个页面 NavigationUIVisibility="Automatic" 是否显示导航栏
     Source 显示的Page的路径-->
     <Frame x:Name="framePage"  HorizontalAlignment="Left" Height="257" VerticalAlignment="Top" Width="567"
            NavigationUIVisibility="Automatic"/>
     <TabControl>
         <TabItem Header="TabItem">
             <Frame Source="PageRoleInfo.xaml" NavigationUIVisibility="Hidden"/>
         </TabItem>
         <TabItem Header="TabItem">
             <Frame Source="PageUser.xaml" NavigationUIVisibility="Hidden"/>
         </TabItem>
     </TabControl>
 </Grid>

//1.直接在xaml 代码中设置Source
//2.
//framePage.Source = new Uri("PageRoleInfo.xaml",UriKind.Relative);
//3.先实例化Page对象
PageRoleInfo pageRoleInfo = new PageRoleInfo();
framePage.Navigate(pageRoleInfo);
string ss = "aaa";
framePage.Navigate(pageRoleInfo, ss);   //假设需要传值

六、控件

1.ListView DataGrid Menu

ListView

ListView：用于显示数据项的列表（DataGrid）

DisplayMemberBinding=“{Binding}”

<Grid>
   <ListView Name="lvList" HorizontalAlignment="Center" Height="311" VerticalAlignment="Top"  Margin="0,84,0,0" ItemsSource="{Binding}">
      <ListView.View>
         <GridView>
             <GridViewColumn>
                 <GridViewColumn.Header>
                     
                     <CheckBox Name="chkAll" Content="全选"/>
                 </GridViewColumn.Header>
                 <GridViewColumn.CellTemplate>
                     <DataTemplate>
                         <CheckBox Name="chk" Tag="{Binding UserId}" IsChecked="{Binding ElementName=chkAll,Path=IsChecked,Mode=OneWay}"/>
                     </DataTemplate>
                 </GridViewColumn.CellTemplate>
             </GridViewColumn>
             
             <GridViewColumn Header="编号"  DisplayMemberBinding="{Binding UserId}" Width="50"/>
             <GridViewColumn Header="账号" Width="80">
                 <GridViewColumn.CellTemplate>
                     <DataTemplate>
                         <Label Content="{Binding UserName}" Foreground="DarkBlue"  HorizontalAlignment="Left"/>
                     </DataTemplate>
                 </GridViewColumn.CellTemplate>
             </GridViewColumn>
             <GridViewColumn Header="状态"  DisplayMemberBinding="{Binding UserState}" Width="50"/>
             <GridViewColumn Header="年龄"  DisplayMemberBinding="{Binding UserAge}" Width="50"/>
         </GridView>
     </ListView.View>
    </ListView>
</Grid>

private void Window_Loaded(object sender, RoutedEventArgs e)
{
    //代码设置Itemssource
    //lvList.ItemsSource = GetUserlist();
    lvList.DataContext = GetUserlist();
}
rivate  List<UserInfo> GetUserlist()
{
  
    List<UserInfo> list = new List<UserInfo>();
    // string sql = "select UserId,UserName,UserState,UserAge from UserInfos";
    // MySqlDataAdapter mySql = new MySqlDataAdapter(sql, myconn);
    list.AddRange(new UserInfo[] {
        new UserInfo(){
        UserId=1,
        UserName="admin",
        UserState=0,
        UserAge=13
        },
        new UserInfo(){
        UserId=2,
        UserName="admin1",
        UserState=1,
        UserAge=31
        },
        new UserInfo(){
        UserId=3,
        UserName="admin2",
        UserState=1,
        UserAge=45
        },
        new UserInfo(){
        UserId=4,
        UserName="admin3",
        UserState=1,
        UserAge=54
        },
   }) ;
    return list;
}
public class UserInfo
{
    public int UserId { get; set; }
    public string UserName { get; set; }
    public int UserState { get; set; }
    public int UserAge { get; set; }
}
DataGrid

网格控件：可以自定义网格显示的数据控件

自定义的网格：列的形式

<Grid>
    <!-- 行列标题显示 HeadersVisibility="All" RowHeaderWidth="30" 行标题宽度
    AutoGenerateColumns="False" 默认自动创建列 
    CanUserAddRows="True" 用户添加行    IsReadOnly="True" 只读不能编辑
    VerticalScrollBarVisibility="Disabled 滚动条   一般auto
    AlternationCount="2" 两行交替行AlternatingRowBackground="Yellow"-->
    <DataGrid HeadersVisibility="All" AutoGenerateColumns="False" Name="dgList" AlternatingRowBackground="Yellow" CanUserAddRows="True" 
              IsReadOnly="True" VerticalScrollBarVisibility="Disabled" AlternationCount="2" GridLinesVisibility="Horizontal" SelectionUnit="Cell"
              RowHeaderWidth="30" SelectionMode="Single" ItemsSource="{Binding UserList}">
        <DataGrid.RowStyle>
            <Style TargetType="DataGridRow">
                <Setter Property="Background" Value="Transparent"/>
                <Style.Triggers>
                    <Trigger Property="ItemsControl.AlternationIndex" Value="0">
                        <Setter Property="Background" Value="Lavender"/>
                    </Trigger>
                    <Trigger Property="ItemsControl.AlternationIndex" Value="1">
                        <Setter Property="Background" Value="LightBlue"/>
                    </Trigger>
                </Style.Triggers>
            </Style>
        </DataGrid.RowStyle>
        <DataGrid.Columns>
            <DataGridTextColumn Header="编号" Binding="{Binding UserId}" Width="50"/>
            
            <DataGridTextColumn Header="姓名" Binding="{Binding UserId}" Width="80">
                <DataGridTextColumn.HeaderTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding}" Foreground="Red"/>
                    </DataTemplate>
                </DataGridTextColumn.HeaderTemplate>
            </DataGridTextColumn>
            
            <DataGridCheckBoxColumn Header="状态" Binding="{Binding UserState}"/>
            
            <DataGridComboBoxColumn Header="部门" x:Name="colDept" SelectedValueBinding="{Binding Deptld}" Width="100"
                                    DisplayMemberPath="DeptName" SelectedValuePath="DeptId">
                <DataGridComboBoxColumn.ElementStyle>
                    <Style TargetType="ComboBox">
                        <Setter Property="ItemsSource" Value="{Binding DataContext.DeptList,RelativeSource={RelativeSource 
                            Mode=FindAncestor,AncestorType=Window}}"/>
                    </Style>
                </DataGridComboBoxColumn.ElementStyle>
                <DataGridComboBoxColumn.EditingElementStyle>
                    <Style TargetType="ComboBox">
                        <Setter Property="ItemsSource" Value="{Binding DataContext.DeptList,RelativeSource={RelativeSource 
                            Mode=FindAncestor,AncestorType=Window} }"/>
                    </Style>
                </DataGridComboBoxColumn.EditingElementStyle>
            </DataGridComboBoxColumn>
            
            <DataGridTemplateColumn Header="年龄" Width="60">
                <DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <Label Content="{Binding UserAge}" Foreground="GreenYellow" Background="BlueViolet"/>
                    </DataTemplate>
                </DataGridTemplateColumn.CellTemplate>
                <DataGridTemplateColumn.CellEditingTemplate>
                    <DataTemplate>
                        <TextBox Text="{Binding UserAge}"/>
                    </DataTemplate>
                </DataGridTemplateColumn.CellEditingTemplate>
            </DataGridTemplateColumn>
        </DataGrid.Columns>
    </DataGr
</Grid>

private void CalendarDate_PreviewMouseUp(object sender, MouseButtonEventArgs e)
{
    if (Mouse.Captured is CalendarItem)
        Mouse.Capture(null);
}

private void Window_Loaded(object sender, RoutedEventArgs e)
{
    //首先设置ComboBox列的数据源
    //colDept.DisplayMemberPath = "DeptName";
    //colDept.ItemsSource = getDepts();
    //如果没有设置列的Name属性
    // DataGridComboBoxColumn deptcol=  dgList.Columns[3] as DataGridComboBoxColumn;
    // deptcol.ItemsSource = getDepts();
    //dgList.ItemsSource = GetUserlist();


    //初始化DGVModel
    //DGVModel dGVModel = new DGVModel();
    //dGVModel.UserList = GetUserList();
    //dGVModel.DeptList = GetDepts();
    //this.DataContext = dGVModel;

}
public class UserInfoNew
{
    public int UserId { get; set; }
    public string UserName { get; set; }
    public int UserState { get; set; }
    public int UserAge { get; set; }
    public int DeptId { get; set; }
}
public class DeptInfo
{
    public int DeptId { get; set; }
    public string DeptName { get; set; }
}
public class DGVModel
{
    public List<UserInfoNew> UserList { get; set; }
    public List<DeptInfo> DeptList { get; set; }
}
Menu

menu: windows 菜单控件

常用属性：

IsMainMenu 是否接收主菜单激活通知 true 按 alt或 f10激活，如果为false,不能激活。

<Window.Resources>
    <!--定义命令-->
    <RoutedUICommand x:Key="cmdNew"/>
    <RoutedUICommand x:Key="cmdOpen"/>
</Window.Resources>
<!--输入绑定 key Mouse-->
<Window.InputBindings>
    <KeyBinding Command="{StaticResource cmdNew}" Gesture="Ctrl+O"/>
</Window.InputBindings>
<!--将命令于处理程序关联起来-->
<Window.CommandBindings>
    <CommandBinding Command="{StaticResource cmdNew}" Executed="MiRole_click"/>
    <CommandBinding Command="{StaticResource cmdOpen}" Executed="MiOpen_click"/>
</Window.CommandBindings>
<Grid>
    <Menu Height="30" VerticalAlignment="Top" IsMainMenu="False">
        <MenuItem Header="File">
            <MenuItem Header="New" Command="{StaticResource cmdNew}" InputGestureText="Ctrl+O" >
                <!--设置图标-->
                <MenuItem.Icon>
                    <Image Source="imgs/histogram.jpg"/>
                </MenuItem.Icon>
            </MenuItem>
            <MenuItem Header="Open" Command="{StaticResource cmdOpen}"/>
            <MenuItem Header="Add" Name="MuAdd" Click="MuAdd_Click"/>
            <MenuItem Header="Run live Share"/>
        </MenuItem>
        <MenuItem Header="View"></MenuItem>
        <MenuItem Header="Edit"></MenuItem>
        <MenuItem Header="Git"></MenuItem>
        <MenuItem Header="Window"></MenuItem>
    </Menu>
</Grid>

private void MiRole_click(object sender, ExecutedRoutedEventArgs e)
{
    NewPage newPage = new NewPage();
    newPage.Show();
}

private void MiOpen_click(object sender, ExecutedRoutedEventArgs e)
{
    OpenPage openPage = new OpenPage();
    openPage.Show();
}
  • **动态生成菜单项：**递归加载菜单数据，分层数据模板
  • 获取菜单数据：按层次结构组织的数据列表
  • **菜单模型：**编号 名称 父菜单编号 快捷键
  • **菜单项模型：**编号 名称 快捷键 子菜单列表
  • **数据模板：**分成数据模板 HeaderedItemsControl Menu TreeView

递归加载菜单的方法，分层数据模板嵌入Menu控件中

2.ContextMenu TreeView ToolBar

ContextMenu

(右键菜单) 上下文菜单

<Grid>
    <!--HorizontalOffset="10" VerticalOffset="5" 相对点击水平垂直位置 ContextMenuService.Placement="Absolute" 
    相对坐标位置RelativePoint相对目标元素-->
    <Label Name="lbl" Content="右键" HorizontalAlignment="Left" VerticalAlignment="Top" Height="40" Width="70" 
           MouseLeftButtonDown="lbl_MouseLeftButtonDown" ContextMenuService.Placement="RelativePoint">
        <Label.ContextMenu>
            <ContextMenu IsOpen="True" HorizontalOffset="10" VerticalOffset="5" HasDropShadow="True" 
                 Placement="{Binding ElementName= lbl}">
                <MenuItem Header="打开页面"/>
                <MenuItem Header="操作" InputGestureText="Ctrl+C">
                    <MenuItem Header="保存"/>
                    <MenuItem Header="另存为"/>
                    <MenuItem Header="取消"/>
                </MenuItem>
            </ContextMenu>
        </Label.ContextMenu>
    </Label>
</Grid>

private void lbl_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
    ContextMenu.PlacementTarget = lbl;
    ContextMenu.IsOpen = true;
}
TreeView

基本属性

 <Window.Resources>
    <Style TargetType="TreeViewItem">
        <Setter Property="Foreground" Value="Orange"/>
        <Setter Property="FontSize" Value="14"/>
        <Setter Property="Padding" Value="10"/>
        <Setter Property="Background" Value="Transparent"/>
        <Style.Triggers>
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="Background" Value="AliceBlue"/>
            </Trigger>
        </Style.Triggers>
    </Style>
</Window.Resources>
<Grid>
    <TreeView HorizontalAlignment="Left" Name="tvList" SelectedItemChanged="tvList_SelectedItemChanged">
        <TreeViewItem Header="C盘">
            <TreeViewItem Header="program" IsExpanded="True" FontSize="12">
                <TreeViewItem Header="Data program"/>
                <TreeViewItem Header="Notepade++"/>
            </TreeViewItem>
            <TreeViewItem Header="System"/>
            <TreeViewItem Header="Data program"/>
            <TreeViewItem Header="Notepade++"/>
        </TreeViewItem>
        <TreeViewItem Header="D盘">
            <TreeViewItem Header="program"/>
            <TreeViewItem Header="System"/>
            <TreeViewItem Header="Data program"/>
            <TreeViewItem Header="Notepade++"/>
        </TreeViewItem>
        <TreeViewItem Header="E盘"/>
    </TreeView>
</Grid>

 /// <summary>
        /// 节点选择响应事件
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
 private void tvList_SelectedItemChanged(object sender, RoutedPropertyChangedEventArgs<object> e)
 {
     var val = e.NewValue as TreeViewItem;
     MessageBox.Show(val.Header.ToString());
 }

代码创建节点

动态生成节点树–分层数据模板

ToolBar

ToolBar 为一组命令或控件的容器

<Window.Resources>
    <RoutedUICommand x:Key="setColor"/> 
</Window.Resources>

<Window.CommandBindings>
    <CommandBinding Command="{StaticResource setColor}" Executed="SetLabelcolor"/>
</Window.CommandBindings>

<Grid>
    <ToolBar HorizontalAlignment="Left" Height="100" Margin="10,10,0,0" VerticalAlignment="Top" Width="621">
        <Button Content="新建" Name="BtnNew" Click="BtnNew_Click"/>
        <Separator/>
        <Image Source="imgs/pyramid.png" Height="20" Width="20"/>
        <CheckBox Content="是否保存" IsChecked="True" Margin="10,0"/>

      
        <RadioButton ToolTip="Red" Command="{StaticResource setColor}">
            <RadioButton.Content>
                <Rectangle Width="10" Height="10" Fill="Red"/>
            </RadioButton.Content>
        </RadioButton>
        <RadioButton ToolTip="Green" Command="{StaticResource setColor}">
            <RadioButton.Content>
                <Rectangle Width="10" Height="10" Fill="Green"/>
            </RadioButton.Content>
        </RadioButton>
        <RadioButton ToolTip="Yellow" Command="{StaticResource setColor}">
            <RadioButton.Content>
                <Rectangle Width="10" Height="10" Fill="Yellow"/>
            </RadioButton.Content>
        </RadioButton>
        <RadioButton ToolTip="Orange" Command="{StaticResource setColor}">
            <RadioButton.Content>
                <Rectangle Width="10" Height="10" Fill="Orange"/>
            </RadioButton.Content>
        </RadioButton>
        <Separator/>
        <ComboBoxItem  Content="选择" VerticalContentAlignment="Center" PreviewMouseLeftButtonUp="ComboBoxItem_PreviewMouseLeftButtonUp"/>
    </ToolBar>
    <Label Name="lbl" Content="我是测试文本" HorizontalAlignment="Left" Margin="133,134,0,0" VerticalAlignment="Top"/>

</Grid>

private void ComboBoxItem_PreviewMouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
    lbl.Content = "相应事件";
}

private void BtnNew_Click(object sender, RoutedEventArgs e)
{
    Window newWin = new Window();
    newWin.Title = "新建页面";
    Frame frame = new Frame();
    frame.Source= new Uri("PageRoleInfo.xaml", UriKind.Relative);
    newWin.Content = frame;
    newWin.Show();
}
ToolBarTray

ToolBarTray 布局多个ToolBar的容器，呈放多个ToolBar Band 行 BandIndex 带区索引

<ToolBarTray  Height="100" VerticalAlignment="Top" Background="Lavender" IsLocked="True">
    <ToolBar Band="0" BandIndex="0" HorizontalAlignment="Left" Height="36"  VerticalAlignment="Top" IsOverflowOpen="True">
        <RadioButton ToolTip="Red" >
            <RadioButton.Content>
                <Rectangle Width="10" Height="10" Fill="Red"/>
            </RadioButton.Content>
        </RadioButton>
        <RadioButton ToolTip="Green">
            <RadioButton.Content>
                <Rectangle Width="10" Height="10" Fill="Green"/>
            </RadioButton.Content>
        </RadioButton>
        <RadioButton ToolTip="Yellow">
            <RadioButton.Content>
                <Rectangle Width="10" Height="10" Fill="Yellow"/>
            </RadioButton.Content>
        </RadioButton>
        <RadioButton ToolTip="Orange">
            <RadioButton.Content>
                <Rectangle Width="10" Height="10" Fill="Orange"/>
            </RadioButton.Content>
        </RadioButton>
        <Separator/>
    </ToolBar>
    <ToolBar Band="0" BandIndex="1" HorizontalAlignment="Left" Height="36"  VerticalAlignment="Top" >
        <Button Content="新建"/>
        <Button Content="打开"/>
    </ToolBar>
    <ToolBar Band="0" BandIndex="2" HorizontalAlignment="Left" Height="36"  VerticalAlignment="Top">
        <RadioButton ToolTip="Red" >
            <RadioButton.Content>
                <Rectangle Width="10" Height="10" Fill="Red"/>
            </RadioButton.Content>
        </RadioButton>
        <RadioButton ToolTip="Green">
            <RadioButton.Content>
                <Rectangle Width="10" Height="10" Fill="Green"/>
            </RadioButton.Content>
        </RadioButton>
        <RadioButton ToolTip="Yellow">
            <RadioButton.Content>
                <Rectangle Width="10" Height="10" Fill="Yellow"/>
            </RadioButton.Content>
        </RadioButton>
        <RadioButton ToolTip="Orange">
            <RadioButton.Content>
                <Rectangle Width="10" Height="10" Fill="Orange"/>
            </RadioButton.Content>
        </RadioButton>
        <Separator/>
    </ToolBar>
</ToolBarTray>

3.StatusBar MediaElement RichTextBox

StatusBar控件

使用 ：主页面显示：登录者，登录时间 当前操作的模块名称 版权信息 进程过程

 <Grid>
    <StatusBar VerticalAlignment="Bottom" HorizontalAlignment="Stretch" Height="30">
        <StatusBar.ItemsPanel>
            <ItemsPanelTemplate>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="100"></ColumnDefinition>
                        <ColumnDefinition Width="300"></ColumnDefinition>
                        <ColumnDefinition Width="200"></ColumnDefinition>
                        <ColumnDefinition ></ColumnDefinition>
                    </Grid.ColumnDefinitions>
                </Grid>
            </ItemsPanelTemplate>
        </StatusBar.ItemsPanel>
        <StatusBarItem Content="登录者：admin" Grid.Column="0"/>
        <StatusBarItem Grid.Column="1">
            <StackPanel Orientation="Horizontal">
                <Label Content="当前时间"/>
                <TextBlock x:Name="tbTime" Text="" VerticalAlignment="Center"/>
            </StackPanel>
        </StatusBarItem>
        <StatusBarItem Grid.Column="2">
            <StackPanel Orientation="Horizontal">
                <Label Content="版权："/>
                <TextBlock Text="PWNGUO.COM" VerticalAlignment="Center"/>
            </StackPanel>
        </StatusBarItem>
        <StatusBarItem HorizontalAlignment="Right" Grid.Column="3">
            <StackPanel Orientation="Horizontal">
                <Label Content="加载进度："/>
  <!--加载动画-->
                <ProgressBar  x:Name="pbar" Value="0" Width="150" Height="25">
                    <ProgressBar.Triggers>
                        <EventTrigger RoutedEvent="ProgressBar.Loaded">
                            <BeginStoryboard>
                                <Storyboard>
                                    <DoubleAnimation From="0" To="{Binding ElementName=pbar,Path=Minimum}" Storyboard.TargetName="pbar" Storyboard.TargetProperty="Value"
                                                     Duration="0:0:5"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </EventTrigger>
                    </ProgressBar.Triggers>
                </ProgressBar>
            </StackPanel>
        </StatusBarItem>
    </StatusBar>
</Grid>

private void Window_Loaded(object sender, RoutedEventArgs e)
{
    tbTime.Text = DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss");
}
MediaElement

媒体播放控件：音视频

<Grid>
    <!--IsMuted="False" 是否静音 Volume="0.3"音量默认值 balance 扬声器百分比  StretchDirection="DownOnly" 视频拉伸方向 根据Stretch="Fill"设置-->
    <Border BorderThickness="5" BorderBrush="Tomato" CornerRadius="10" HorizontalAlignment="Left"  VerticalAlignment="Top" >
        <MediaElement Source="medias/video1.mp4"  LoadedBehavior="Play" IsMuted="False" Volume="0.3" UnloadedBehavior="Stop" SpeedRatio="1"
                      StretchDirection="Both" Stretch="Fill"/>
    </Border>
</Grid>

媒体播放器制作

 <Window.Resources>
    <Style x:Key="btnStyle" TargetType="Button">
        <Setter Property="Background">
            <Setter.Value>
                <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
                    <GradientStop Offset="0" Color="White"/>
                    <GradientStop Offset="0.444" Color="#FF53897A"/>
                </LinearGradientBrush>
            </Setter.Value>
        </Setter>
        <Setter Property="FontStyle" Value="Oblique"/>
        <Setter Property="Margin" Value="5"/>
        <Setter Property="Width" Value="60"/>
        <Setter Property="Foreground" Value="Gold"/>
        <Style.Triggers>
            <Trigger Property="Button.IsMouseOver" Value="True">
                <Setter Property="Foreground" Value="Black"/>
            </Trigger>
        </Style.Triggers>
    </Style>
</Window.Resources>
<Grid>
    <StackPanel>
        <Border Background="Black" BorderThickness="3" HorizontalAlignment="Center"  VerticalAlignment="Top">
            <Border.Effect>
                <DropShadowEffect Color="#FFE4CC8D"/>
            </Border.Effect>
            <Border.BorderBrush>
                <LinearGradientBrush StartPoint="1,0" EndPoint="1,1">
                    <GradientStop Offset="0" Color="White"/>
                    <GradientStop Offset="0.5" Color="Gold"/>
                </LinearGradientBrush>
            </Border.BorderBrush>
            <MediaElement Name="me" LoadedBehavior="Manual" SpeedRatio="1" Stretch="Fill" UnloadedBehavior="Stop" ScrubbingEnabled="True"
                          Volume="{Binding ElementName=me,Path=AllowDrop}" Balance="0.6" Height="200" Width="300" MouseLeftButtonDown="me_MouseLeftButtonDown"
                          MediaOpened="me_MediaOpened" MediaEnded="me_MediaEnded"/>
        </Border>
   
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Margin="0,10,10,0">
        <TextBlock Text="播放进度" Foreground="Green" Margin="5"/>
        <Slider x:Name="posSlider" Minimum="0" Width="190" Value="{Binding ElementName=me,Path=Position}"
                Maximum="{Binding ElementName=me,Path=NaturalDuration}" IsMoveToPointEnabled="True"
                PreviewMouseLeftButtonUp="posSlider_PreviewMouseLeftButtonUp"/>
        <TextBlock Text="音量" Foreground="Gold" Margin="20,0,0,0"/>
        <Slider x:Name="volumeSlider" Margin="10,0" Minimum="0" Maximum="1" Value="0.5" Width="167"/>
    </StackPanel>
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Bottom" Margin="0,10">
        <Button x:Name="openBtn" Content="打开" Style="{StaticResource btnStyle}" Click="openBtn_Click"/>
        <Button x:Name="playBtn" Content="播放" Style="{StaticResource btnStyle}" Click="playBtn_Click"/>
        <Button x:Name="stopBtn" Content="停止" Style="{StaticResource btnStyle}" Click="stopBtn_Click"/>
        <Button x:Name="backBtn" Content="快退" Style="{StaticResource btnStyle}" Click="backBtn_Click"/>
        <Button x:Name="forwardBtn" Content="快进" Style="{StaticResource btnStyle}" Click="forwardBtn_Click"/>
        <Label Name="lblTime" Width="100" Height="30" Content="00:04"></Label>
    </StackPanel>
 </StackPanel>
</Grid>

private void BtnNew_Click(object sender, RoutedEventArgs e)
{
    Window newWin = new Window();
    newWin.Title = "新建页面";
    Frame frame = new Frame();
    frame.Source= new Uri("PageRoleInfo.xaml", UriKind.Relative);
    newWin.Content = frame;
    newWin.Show();
    
}
System.Timers.Timer timer = null;
private void Window_Loaded(object sender, RoutedEventArgs e)
{
    timer = new System.Timers.Timer();
    timer.Interval = 1000;
    timer.Elapsed += Timer_Elapsed;
   // tbTime.Text = DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss");
}
private void Timer_Elapsed(object sender,System.Timers.ElapsedEventArgs e)
{
    //子线程执行
    this.Dispatcher.Invoke(new Action(() =>
    {
        //主线程
        posSlider.Value = me.Position.TotalSeconds;
        SetTime();
    }));
}
/// <summary>
/// 设置时间文本框的值
/// </summary>
private void SetTime()
{
    lblTime.Content = string.Format( "{0:00}:{1:00}:{2:00}",me.Position.Hours,me.Position.Minutes,me.Position.Seconds);
}

private void openBtn_Click(object sender, RoutedEventArgs e)
{
    OpenFileDialog ofd = new OpenFileDialog();
    ofd.Filter = @"视频文件(*.avi格式)|*.avi|视频文件(*.wav格式)|*.wmv|视频文件(*.wmv格式)|*.mp4|视频文件(*.mp4格式)|*.mp4|All Files|*.*";
    if(ofd.ShowDialog()==false)
    {
        return;
    }
    string filePath = "";
    filePath = ofd.FileName;
    if (filePath == "")
        return;
    //设置媒体源
    me.Source = new Uri(filePath, UriKind.Absolute);
    playBtn.IsEnabled = true;
    me.Play();
    timer.Start();
    playBtn.Content = "暂停";
}

private void playBtn_Click(object sender, RoutedEventArgs e)
{
    SetPlayer(true);
    PlayPause();
   
}
/// <summary>
/// 播放或暂停
/// </summary>
private void PlayPause()
{
    if (playBtn.Content.ToString() == "播放")
    {
        me.Play();
        timer.Start();
        playBtn.Content = "暂停";
        me.ToolTip = "单击暂停";
    }
    else
    {
        me.Pause();
        timer.Stop();
        playBtn.Content = "播放";
        me.ToolTip = "单击播放";
        SetTime();
    }
}
private void SetPlayer(bool bl)
{
    stopBtn.IsEnabled = bl;
    playBtn.IsEnabled = bl;
    backBtn.IsEnabled = bl;
    forwardBtn.IsEnabled = bl;
}

private void stopBtn_Click(object sender, RoutedEventArgs e)
{
    me.Stop();
    posSlider.Value = 0;
    lblTime.Content = "0:0:0";
    playBtn.Content = "播放";
    timer.Stop();
}

private void forwardBtn_Click(object sender, RoutedEventArgs e)
{
    me.Pause();
    timer.Stop();
   me.Position = me.Position + TimeSpan.FromSeconds(10);
    SetTime();
    me.Play();
    timer.Start();
}

private void backBtn_Click(object sender, RoutedEventArgs e)
{
    me.Pause();
    timer.Stop();
    me.Position = me.Position - TimeSpan.FromSeconds(10);
    SetTime();
    me.Play();
    timer.Start();
}

private void me_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
    
    PlayPause();
}
/// <summary>
/// 媒体加载完毕后
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void me_MediaOpened(object sender, RoutedEventArgs e)
{
    posSlider.Maximum = me.NaturalDuration.TimeSpan.TotalSeconds;
    lblTime.Content = "0:0:0";

}

private void posSlider_PreviewMouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
    me.Pause();
    timer.Stop();
    int val = (int)posSlider.Value;
    me.Position = new TimeSpan(0, 0, 0, val);
    SetTime();
    me.Play();
    timer.Start();
}

private void me_MediaEnded(object sender, RoutedEventArgs e)
{
    me.Stop();
    timer.Stop();
}
RichTextBox
<Grid>
    <!--IsDocumentEnabled="True" 可编辑富文本框设置-->
    <RichTextBox x:Name="rtbContext" HorizontalAlignment="Left" Height="230" Width="auto" VerticalAlignment="Top" IsDocumentEnabled="True">
        <FlowDocument>
            <Paragraph TextIndent="24">
                <Run Text="RichTextBox"/>
                <Hyperlink Click="Hyperlink_Click">百度一下</Hyperlink>
            </Paragraph>
            <Paragraph>
                <Run Text="标题栏1"/>
            </Paragraph>
            <Section>
                <Paragraph>
                    <Run Text="标题栏2"/>
                    <InlineUIContainer>
                        <TextBox Text="12.00"/>
                    </InlineUIContainer>
                </Paragraph>
                <Paragraph>
                    <Run Text="标题栏3"/>
                </Paragraph>
                <BlockUIContainer>
                    <StackPanel Orientation="Horizontal">
                        <Label Content="admin" Width="60"/>
                        <Button Content="添加" Width="60" Height="30" Click="Button_Click"/>
                    </StackPanel>
                </BlockUIContainer>
            </Section>
        </FlowDocument>
    </RichTextBox>
    <Button x:Name="GetText" Content="Button" HorizontalAlignment="Left" Margin="623,289,0,0" VerticalAlignment="Top" Click="GetText_Click"/>

</Grid>

   private void Button_Click(object sender, RoutedEventArgs e)
{
    MessageBox.Show("这是个按钮");
}

private void Hyperlink_Click(object sender, RoutedEventArgs e)
{
    Process proc = new Process();
    proc.StartInfo.FileName = "http://www.baidu.com";
    proc.Start();
}

private void GetText_Click(object sender, RoutedEventArgs e)
{
    TextRange range=new TextRange(rtbContext.Document.ContentStart, rtbContext.Document.ContentEnd);
    string contentTxt = range.Text;
    MessageBox.Show(contentTxt);
}

悬浮球

 <Window Title="TestWindow" Height="200" Width="200" WindowStyle="None" AllowsTransparency="True" Background="Transparent" OpacityMask="White" ResizeMode="NoResize" MouseLeftButtonDown="Window_MouseLeftButtonDown" WindowStartupLocation="CenterScreen">
 <Grid Background="Transparent">
     <Border BorderThickness="5" BorderBrush="DarkGreen"  CornerRadius="100"  Name="top">
        <!--实现相关内容-->
     </Border>
 </Grid>

日志打印功能

    <Grid>
        <TextBox Name="txtLog" AcceptsReturn="True" 
                 TextWrapping="Wrap" Foreground="Green"
                 Grid.Row="1" Grid.ColumnSpan="2"
                 VerticalScrollBarVisibility="Auto"
                 HorizontalScrollBarVisibility="Auto"/>
    </Grid>

public MainWindow()
{
    InitializeComponent();
    ThreadPool.QueueUserWorkItem(sender =>
    {
        while (true)
        {
            this.txtLog.Dispatcher.BeginInvoke((Action)delegate
            {
                this.txtLog.AppendText(DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss fff\r\n"));
                if (IsVerticalScrollBarAtBottom)
                {
                    this.txtLog.ScrollToEnd();
                }
            });
            Thread.Sleep(600);
        }
    });

}
public bool IsVerticalScrollBarAtBottom
{
    get
    {
        bool atBottom = false;

        this.txtLog.Dispatcher.Invoke((Action)delegate
        {
            double dVer = this.txtLog.VerticalOffset;       //获取竖直滚动条滚动位置
            double dViewport = this.txtLog.ViewportHeight;  //获取竖直可滚动内容高度
            double dExtent = this.txtLog.ExtentHeight;      //获取可视区域的高度

            if (dVer + dViewport >= dExtent)
            {
                atBottom = true;
            }
            else
            {
                atBottom = false;
            }
        });

        return atBottom;
    }
}

猜你喜欢

转载自blog.csdn.net/qq_37431937/article/details/124853579
今日推荐
openKylin 社区生态委员会第六次会议圆满召开
阿里云正式发布通义千问 2.5
Python 3.13 发布首个 Beta：实验性自由线程模式和 JIT、改进交互式解释器
Stack Overflow 拿我的代码去训练 AI 大模型，还封了我的账号
Pop!_OS 的 COSMIC 桌面完成 App Store 上架工作
报告：Django 仍然是 74% 开发者的首选
《2024 年一季度互联网投融资运行情况》研究报告
15 年前上了“FFmpeg 耻辱柱”，今天他还得谢谢咱——腾讯QQPlayer一雪前耻？
TIOBE 5 月榜单：Fortran “复活”进入 Top 10
GCC 14.1 发布
面壁智能发布 Eurux-8x22B 开源大模型 —— 堪称「理科状元」
开源日报 | 谷歌扶持鸿蒙上位；开源Rabbit R1；Docker加持的安卓手机；微软的焦虑和野心；海尔电器把开放平台关了
周排行
计算机组成与设计（七）—— 除法器
Integer Approximation(分治+枚举)
大话数据库索引
windows10系统JDK的配置及下载地址
mysql实现秒值转换中原六仔平台搭建
Codeforces Round #556 (Div. 1)
百练1064 网线主管
Codeforces 995F Cowmpany Cowmpensation
子集生成之增量构造法，位向量法，二进制法
ERROR: cmd.exe failed with args /c "/APK\gradle\rungradle.bat...
每日归档
更多
2024-05-10(38)
2024-05-09(35)
2024-05-08(42)
2024-05-07(14)
2024-05-06(40)
2024-05-05(0)
2024-05-04(7)
2024-05-03(19)
2024-05-02(0)
2024-05-01(4)

代码天地 © 2018 codetd.com

境外服务器   最新电视剧2022