WPF学习笔记（1）

1.

  <Grid>
    <Grid.RowDefinitions>
      <RowDefinition Height="*" />
      <RowDefinition Height="Auto" />
      <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Grid.Background>
      <LinearGradientBrush>
        <LinearGradientBrush.GradientStops>
          <GradientStop Offset="0.00"  Color="Red" />
          <GradientStop Offset="0.50" Color="Indigo" />
          <GradientStop Offset="1.00" Color="Violet" />
        </LinearGradientBrush.GradientStops>
      </LinearGradientBrush>
    </Grid.Background>    
  </Grid>

　　

2.

public class Window1 : Window
    {
        private Button button1;        

        public Window1(string xamlFile)
        {
            InitializeComponent(xamlFile);
        }                

        private void InitializeComponent(string xamlFile)
        {
            // Configure the form.
            this.Width = this.Height = 285;
            this.Left = this.Top = 100;
            this.Title = "Dynamically Loaded XAML";

            // Get the XAML content from an external file.
            DependencyObject rootElement;
            using (FileStream fs = new FileStream(xamlFile, FileMode.Open))
            {
                rootElement = (DependencyObject)XamlReader.Load(fs);
            }

            // Insert the markup into this window.
            this.Content = rootElement;                       

            // Find the control with the appropriate name.
            //button1 = (Button)LogicalTreeHelper.FindLogicalNode(rootElement, "button1");
            FrameworkElement frameworkElement = (FrameworkElement)rootElement;
            button1 = (Button)frameworkElement.FindName("button1");

            // Wire up the event handler.
            button1.Click += new RoutedEventHandler(button1_Click);
        }
        
        private void button1_Click(object sender, RoutedEventArgs e)
        {
            button1.Content = "Thank you.";
        }
    }

//调用
 public class Program : Application
    {
        [STAThread()]
        static void Main()
        {
            Program app = new Program();
            app.ShutdownMode = ShutdownMode.OnLastWindowClose;

            Window1 window1 = new Window1("Window1.xaml");
            window1.Show();

            
            app.Run();
        }
    }

 3.

//stackpanel的布局

    //stackpanel的布局
            stackPanel1.Orientation = Orientation.Horizontal;
            stackPanel1.Orientation = Orientation.Vertical;

　4.　

//WrapPanel 相当于css中的浮动效果
<WrapPanel Margin="3">
    <Button VerticalAlignment="Top">Top Button</Button>
    <Button MinHeight="60">Tall Button 2</Button>
    <Button VerticalAlignment="Bottom">Bottom Button</Button>
    <Button>Stretch Button</Button>
    <Button VerticalAlignment="Center">Centered Button</Button>   
  </WrapPanel>

　　5.

// DockPanel 
<DockPanel LastChildFill="True">
      <Button DockPanel.Dock="Top">A Stretched Top Button</Button>
      <Button DockPanel.Dock="Top" HorizontalAlignment="Center">A Centered Top Button</Button>
      <Button DockPanel.Dock="Top" HorizontalAlignment="Left">A Left-Aligned Top Button</Button>
      <Button DockPanel.Dock="Bottom">Bottom Button</Button>
      <Button DockPanel.Dock="Left">Left Button</Button>
      <Button DockPanel.Dock="Right">Right Button</Button>
      <Button >Remaining Space</Button>
    </DockPanel>

　　

6.

//网格布局Grid

Grid是以表格形式组织控件的一种布局方式，与Java AWT中 的GridLayout类似，但区别在于

　　WPF中的Grid的每一个单元格中可以放置 多个控件，但控件可能会层叠在一起

　　WPF中的Grid支持单元格的合并，类 似于HTML中的table td中的rowspan和colspan

　　Grid中的行和列可以自定 义高度(Height)和宽度(Width)

　　在设置高度和宽度时可以采用两种写 法：

　　1)Height=”60”：不加“星号”表示固定 的高度

　　2)Height=”60*”：加“星号”表示 “加权”的高度，在调整窗体大小时，此高度或宽度会按窗体大小改 

//网格布局
<Grid ShowGridLines="True">
        <Grid.RowDefinitions>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition></ColumnDefinition>
            <ColumnDefinition></ColumnDefinition>
            <ColumnDefinition></ColumnDefinition>
        </Grid.ColumnDefinitions>
        <Button Grid.Row="0" Grid.Column="0">Top Left</Button>
        <Button Grid.Row="0" Grid.Column="1">Middle Left</Button>
        <Button Grid.Row="1" Grid.Column="2">Bottom Right</Button>
        <Button Grid.Row="1" Grid.Column="1">Bottom Middle</Button>
    </Grid>

　　

7.

//UseLayoutRounding 布局舍入

//UseLayoutRounding 布局舍入
//Grid宽度100，分3列显示，那么每一列的宽度33.3333
//应用UseLayoutRounding="True"后，有一列宽度会变为34，其余为33达到舍入效果！
//页面自适应时，例如改变窗口大小时，控件会有抖动问题，参考此属性，即可解决！

<Grid x:Name="LayoutRoot" Background="White" Width="100">
	<Grid.ColumnDefinitions>
		<ColumnDefinition  />
		<ColumnDefinition  />
		<ColumnDefinition />
	</Grid.ColumnDefinitions>
	<Grid.RowDefinitions>
		<RowDefinition/>
	</Grid.RowDefinitions>
  	<TextBox Text="TextBox" Grid.Column="0" Grid.Row="0"  />
	<TextBox Text="TextBox" Grid.Column="1" Grid.Row="0"  />
	<TextBox Text="TextBox" Grid.Column="2" Grid.Row="0"  />
</Grid>

　　

8.

//GridSplitter 
可以使用GridSplit控件结合Grid控件 实现类似于Windows应用程序中SplitContainer的功能

//GridSplitter 
 <Grid>
      <Grid.RowDefinitions>
        <RowDefinition></RowDefinition>
        <RowDefinition></RowDefinition>
      </Grid.RowDefinitions>
      <Grid.ColumnDefinitions>
        <ColumnDefinition MinWidth="100"></ColumnDefinition>
        <ColumnDefinition Width="Auto"></ColumnDefinition>
        <ColumnDefinition MinWidth="50"></ColumnDefinition>
      </Grid.ColumnDefinitions>

      <Button Grid.Row="0" Grid.Column="0" Margin="3">Left</Button>
      <Button Grid.Row="0" Grid.Column="2" Margin="3">Right</Button>
      <Button Grid.Row="1" Grid.Column="0" Margin="3">Left</Button>
      <Button Grid.Row="1" Grid.Column="2" Margin="3">Right</Button>
      
      <GridSplitter Grid.Row="0" Grid.Column="1" Grid.RowSpan="2"                
                  Width="3" VerticalAlignment="Stretch" HorizontalAlignment="Center"
                  ShowsPreview="False"></GridSplitter>
     
    </Grid>

　

　

9.

//共享控件大小 SharedSizeGroup

//共享控件大小 SharedSizeGroup
<Grid Grid.IsSharedSizeScope="True" Margin="3">
      <Grid.RowDefinitions>
        <RowDefinition></RowDefinition>
        <RowDefinition Height="Auto"></RowDefinition>
        <RowDefinition></RowDefinition>
      </Grid.RowDefinitions>

      <Grid Grid.Row="0" Margin="3" Background="LightYellow" ShowGridLines="True">
        <Grid.ColumnDefinitions>
          <ColumnDefinition Width="Auto" SharedSizeGroup="TextLabel"></ColumnDefinition>
          <ColumnDefinition Width="Auto"></ColumnDefinition>
          <ColumnDefinition></ColumnDefinition>
        </Grid.ColumnDefinitions>

        <Label Margin="5">A very long bit of text</Label>
       <!-- <GridSplitter Grid.Column="1" VerticalAlignment="Stretch" HorizontalAlignment="Center" Width="10"></GridSplitter> -->
        <Label Grid.Column="1" Margin="5">More text</Label>
        <TextBox Grid.Column="2" Margin="5">A text box</TextBox>
      </Grid>
      <Label Grid.Row="1" >Some text in between the two grids...</Label>
      <Grid Grid.Row="2" Margin="3" Background="LightYellow"  ShowGridLines="True">
        <Grid.ColumnDefinitions>
          <ColumnDefinition Width="Auto" SharedSizeGroup="TextLabel"></ColumnDefinition>
          <ColumnDefinition></ColumnDefinition>
        </Grid.ColumnDefinitions>

        <Label Margin="5">Short</Label>
        <TextBox Grid.Column="1" Margin="5">A text box</TextBox>
      </Grid>
    </Grid>

10.　　

//InkCanvas 

• 主要目的是（通过鼠标或者和指示笔）捕捉笔迹。
  
• 从FrameworkElement 继承。
  
• 默认模式下，InkCanvas 允许在它的表面上进行简单的书写和画图。当使用指示笔时，笔尖用来写、笔端用来擦。、
  
• 通过使用InkCanvas 的DefaultDrawingAttributes 属性，可以改变以后输入的笔画外观（宽度、颜色等）。
  
• 利用EditingMode 属性被独立地应用到指示笔尖（或鼠标），并通过Edit ingModeInverted 属性来应用于指示笔的末端（back end）。只读的ActiveEdit ingMode 属性可以告诉你哪一个属性当前正在被使用。所有这3 个属性都是InkCanvasEdit ingMode 类型的，它有以下几种值：
  ·Ink（Edit ingMode 的默认值）—— 通过鼠标或者指示笔来绘制笔画。
  ·InkAndGesture —— 和Ink 一样，但同样可以识别用户的手势。手势的列表（Up、Down、Circle、
  ScratchOut 和Tap）保存在System.Windows.Ink.Applicat ionGesture 枚举类型中。
  ·GestureOnly —— 只识别手势，不会绘制用户输入的笔画。
  ·EraseByStroke （Edit ingModeInverted 的默认值）—— 当笔画被触及时将笔画擦掉。
  ·EraseByPoint —— 只擦掉直接碰及到的笔画部分（就像传统的铅笔橡皮）。
  ·Select —— 当被触及时，选择笔画或者任何UIElement，使它们能被删除、移动或者在InkCanvas 范
  围内被调整尺寸。
  ·None —— 对于鼠标或者指示笔不做任何响应。
  
• 定义了15 种事件，其中包括改变编辑模式、改变/移动/调整选择、收集或者擦除笔画，以及执行手势。
  

<Grid>
      <Grid.RowDefinitions>
        <RowDefinition Height="Auto"></RowDefinition>
        <RowDefinition></RowDefinition>
      </Grid.RowDefinitions>
      <StackPanel Margin="5" Orientation="Horizontal">
        <TextBlock Margin="5">EditingMode: </TextBlock>
        <ComboBox Name="lstEditingMode"  VerticalAlignment="Center">          
        </ComboBox>
      </StackPanel>
      
      <InkCanvas Name="inkCanvas" Grid.Row="1" Background="LightYellow" EditingMode="{Binding ElementName=lstEditingMode,Path=SelectedItem}">
        <Button InkCanvas.Top="10" InkCanvas.Left="10">Hello</Button>
        <!--<Image Source="office.jpg" InkCanvas.Top="10" InkCanvas.Left="10"
               Width="287" Height="319"></Image>-->
      </InkCanvas>
    </Grid>

　　后台代码

 public SimpleInkCanvas()//构造函数
        {
            InitializeComponent();
	foreach (InkCanvasEditingMode mode in Enum.GetValues(typeof(InkCanvasEditingMode)))
			{
                lstEditingMode.Items.Add(mode);
                lstEditingMode.SelectedItem = inkCanvas.EditingMode;
            }
        }

11.

UniformGrid 控件为控件提供了一种简化的 网格布局。当控件添加到 UniformGrid 时，它们会排列在一个网格模式中，该 网格模式会自动调整以使控件之间的距离保持均匀。单元格的数目将进行调整， 以适应控件的数目。例如，如果四个控件添加到 UniformGrid 中，它们将安排 在包含四个单元格的网格中。

在使用UniformGrid的时候：

　　各单元格的大小完全相同

　　单元格的数量取决于放入的控件的数量，且单元格一定是行、列数相同的，即 1*1、2*2、3*3、4*4…的单元格分布

//UniformGrid 

<UniformGrid Rows="2" Columns="2">
      <Button>Top Left</Button>
      <Button>Top Right</Button>
      <Button>Bottom Left</Button>
      <Button>Bottom Right</Button>
    </UniformGrid>

　　

12.

//AddHandler添加事件+FindLogicalNode寻找控件

 public ModularContent()
        {
            InitializeComponent();

            AddHandler(CheckBox.CheckedEvent, new RoutedEventHandler(chk_Checked));
            AddHandler(CheckBox.UncheckedEvent, new RoutedEventHandler(chk_Unchecked));            
        }

        private void chk_Checked(object sender, RoutedEventArgs e)
        {
            CheckBox chk = (CheckBox)e.OriginalSource;
            DependencyObject obj = LogicalTreeHelper.FindLogicalNode(this, "控件名");
            ((FrameworkElement)obj).Visibility = Visibility.Visible;
        }

        private void chk_Unchecked(object sender, RoutedEventArgs e)
        {
            CheckBox chk = (CheckBox)e.OriginalSource;
            DependencyObject obj = LogicalTreeHelper.FindLogicalNode(this, "控件名");
            ((FrameworkElement)obj).Visibility = Visibility.Collapsed;
        }