技术开发 频道

WPF企业应用基础:布局全接触

  六. WrapPanel

  WrapPanel是一个非常简单的面板,从左至右按顺序位置定位子元素,如果排满断开至下一行。后续排序按照从上至下或从右至左的顺序进行。WrapPanel面板也提供了 Orientation属性设置排列方式,这跟上面的StackPanel基本相似。不同的是WrapPanel会根据内容自动换行。

4

  要实现的效果如下图(用XAML和C#实现同一效果):

4

  XAML代码实现:

<Window    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"    x:Class="WPFLayoutDemo.WrapPanelDEMO"    x:Name="Window"  
  Title
="WrapPanelDEMO"    WindowStartupLocation="CenterScreen"     Width="640" Height="480">  
<WrapPanel Margin="0,0,0,0" Background="White">          
<Rectangle Margin="10,10,10,10" Fill ="Azure" Width="60" Height="60"/>
<Rectangle Margin="10,10,10,10" Fill ="Azure" Width="60" Height="60"/>        
<Rectangle Margin="10,10,10,10" Fill ="Azure" Width="60" Height="60"/>              
<Rectangle Margin="10,10,10,10" Fill ="Azure" Width="60" Height="60"/>        
<Rectangle Margin="10,10,10,10" Fill ="Azure" Width="60" Height="60"/>          
<Rectangle Margin="10,10,10,10" Fill ="Azure" Width="60" Height="60"/>          
<Rectangle Margin="10,10,10,10" Fill ="Azure" Width="60" Height="60"/>        
<Rectangle Margin="10,10,10,10" Fill ="Azure" Width="60" Height="60"/>        
<Rectangle Margin="10,10,10,10" Fill ="Azure" Width="60" Height="60"/>      
<Rectangle Margin="10,10,10,10" Fill ="Azure" Width="60" Height="60"/>      
<Rectangle Margin="10,10,10,10" Fill ="Azure" Width="60" Height="60"/>  
</WrapPanel>
</Window>

   C#代码实现:

namespace WPFLayoutDemo{
  
public partial class WrapPanelDEMOCodeBehind
{      
public WrapPanelDEMOCodeBehind()        {        
this.InitializeComponent();            WrapPanel wp
= new WrapPanel();          
  
//把wp添加为窗体的子控件        
this.Content
= wp;        
wp.Margin
= new Thickness(0, 0, 0, 0);          
wp.Background
= new SolidColorBrush(Colors.White);    
  
//遍历增加Rectangles      
Rectangle r;        
for (int i = 0; i <= 10; i++)            {                
r
= new Rectangle();          
  r.Fill
= new SolidColorBrush(Colors.Azure);            
    r.Margin
= new Thickness(10, 10, 10, 10);              
r.Width
= 60;              
r.Height
= 60;            
   wp.Children.Add(r);          
}              
}  
}
}

   

0
相关文章