WPF: 随便一个面板都可以绑定集合数据，不是非DataGrid莫属地~~看看自定义控件外观

主要介绍如何用任意的Panel去绑定集合数据，这样就可以根据Panel的特性去展示数据了（StackPanel，WrapPanel，ListBox）。。。
好了废话不说代码先行（注视都在代码里）

1. UI界面布局，也是重要的实现细节

<Window x:Class="TestWPF2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Grid.Resources>
            <!--定义每一项的模板，这里可以加任何你想要的trigger，style。。。-->
            <DataTemplate x:Key="DayControl">
                <StackPanel Orientation="Vertical" >
                    <TextBlock Text="{Binding Path=Month, StringFormat={}{0}月}" TextAlignment="Center" VerticalAlignment="Center" />
                    <TextBlock Text="{Binding Path=Day, StringFormat={}{0}日}" TextAlignment="Center" VerticalAlignment="Center" />                   
                </StackPanel>
            </DataTemplate>
            <!--绑定集合一般把它用CollectionViewSource托管一下，这个东西可以方便的排序啊分组啊过滤啊什么的~~其乐无穷-->
            <CollectionViewSource x:Key="DateSource" Source="{Binding Path=Dates}"></CollectionViewSource>
        </Grid.Resources>

        <!--
        //       这里可以把滚动条禁掉，让外界看不到listbox的影子，而且还可以作一个ListBoxItem的template，
        //        这样一来连ListBoxItem特有的选中啊之类的特性也去掉，可以在resources里加个style：见文末

        -->
        <ListBox ItemTemplate="{StaticResource DayControl}" Width="400" Grid.Column="1" 
                 ItemsSource="{Binding Source={StaticResource DateSource}}" 
                 ScrollViewer.HorizontalScrollBarVisibility="Disabled" 
                 ScrollViewer.VerticalScrollBarVisibility="Disabled" >
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <!--这里我用了UniformGrid，懒得去布局了，大家可以把它换成任何你想要的panel，试试看~~-->
                    <UniformGrid  Columns="7" Rows="6"></UniformGrid>
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>

        </ListBox>
    </Grid>
</Window>

2. 后台数据源代码

 1  public partial class MainWindow : Window
 2     {
 3         //数据集合
 4         private ObservableCollection<DateTime> dates = new ObservableCollection<DateTime>();
 5         public ObservableCollection<DateTime> Dates
 6         {
 7             set
 8             {
 9                 if (this.dates != value)
10                 {
11                     this.dates = value;
12 
13                 }
14             }
15             get { return this.dates; }
16 
17         }
18 
19         public MainWindow()
20         {
21             InitializeComponent();
22 
23             //将数据源设置为当前类
24             this.DataContext = this;
25 
26             //初始化数据源
27             this.InitDates(DateTime.Now);
28         }
29 
30         ///  
31         /// 此函数产生本月的日期，并且要有前后月的日子
32         /// 
33         /// 
34         void InitDates(DateTime date)
35         {
36            List<string> WeekDay = new List<string> { "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday" };
37 
38             this.Dates.Clear();
39             
40             DateTime startDate = new DateTime(date.Year, date.Month, 1);
41             int index = WeekDay.IndexOf(startDate.DayOfWeek.ToString());
42             //如果1号为周一 1-7号要加载上个月的日子
43             if (index == 0)
44             {
45                 index = 7;
46             }
47             int counter = 0;
48             while (counter < 42)
49             {            
50                 var day = startDate.AddDays(-index + counter);                
51                 this.Dates.Add(day);
52                 counter++;
53             }
54 
55 
56         }
57     }

3. 界面截图

这个截图是没有给ListBoxItem重定义Style的，可以试试把这段代码放到Resource里面

然后就可以看到，当你点击日期的时候已经没有选中效果了~~

欢迎讨论~~

posted @ 2010-12-03 18:01 vvGO 阅读(1328) 评论(0) 收藏举报

刷新页面返回顶部

那奋斗的年代

WPF: 随便一个面板都可以绑定集合数据，不是非DataGrid莫属地~~看看自定义控件外观

公告