[WP7學習筆記] DataBinding (2)

繼續(1)的例子, 首先把ListBox的ItemTemplate跟Style一起做成Resource

<Style x:Key="Style_RadioButtonListItem" TargetType="ListBoxItem">
            <Setter Property="Padding" Value="3" />
            <Setter Property="VerticalContentAlignment" Value="Top" />
            <Setter Property="Background" Value="Red" />
            <Setter Property="Foreground" Value="Blue" />
            <Setter Property="BorderThickness" Value="1"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ListBoxItem">
                        <Grid Background="Yellow">
                            <RadioButton IsChecked="{Binding Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}, Path=IsSelected}"/>
                            <TextBlock Foreground="{Binding Foreground, RelativeSource={RelativeSource TemplatedParent}}" TextWrapping="Wrap" Text="{Binding DataContext.CategoryDesc, RelativeSource={RelativeSource TemplatedParent}}"></TextBlock>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

其中這一段

<TextBlock Foreground="{Binding Foreground, RelativeSource={RelativeSource TemplatedParent}}" TextWrapping="Wrap" Text="{Binding DataContext.CategoryDesc, RelativeSource={RelativeSource TemplatedParent}}"></TextBlock>

因為這個TextBox是ListBoxItem Template的一部分, 他的資料來源是他的TemplatedParent, 也就是ListBox, 因此指定RelativeSource={RelativeSource TemplatedParent}.

另外因為我希望每個ListBoxItem都顯示出選項的說明, 因此指定Text屬性Bind到DateContext (在我的例子裡, 是一個Category物件)的CategoryDesc屬性.
ListBox則改寫為

<ListBox x:Name="_Categories" Grid.Row="1" Background="Blue"
                 SelectedItem="{Binding SelectedCollectionItem,Mode=TwoWay}"
                 ItemContainerStyle="{StaticResource Style_RadioButtonListItem}">

以程式指定ListBox的Items資料來源以及預設的選項

var categories = Data.DAL.Instance.QueryCategories();
_Categories.ItemsSource = categories;

_Categories.SelectedItem = _Categories.Items.First();//接下來應該有辦法可以讓這一段也用DataBinding的方式做才對…

結果如下…只能說,有沒有美感真的是差很多啊…XD