Windows 8活集线器瓷砖

Question

我正在使用Callisto在Windows 8应用程序中创建活动集线器块，但我没有为我的活动瓷砖执行数据绑定。我使用的代码如下：

<callisto:LiveTile x:Name="liveTile2" 
            Background="#3B5998"
            ItemsSource="{Binding Tile}"
            Grid.Column="5"
            Grid.Row="1"
            Height="250"
            VerticalAlignment="Top"
            BorderBrush="White" BorderThickness="1"
            Margin="5" 
            Direction="Up">
            <callisto:LiveTile.ItemTemplate>
                <DataTemplate>
                    <Grid Margin="5">
                        <Grid.DataContext>
                            <ViewModel:Tile/>
                        </Grid.DataContext>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="*" />
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>

                        <Image x:Name="tileImage" Source="{Binding Image}"/>


                        <TextBlock Foreground="White"
                            TextWrapping="Wrap"
                            TextTrimming="WordEllipsis" 
                            FontSize="14"
                            Grid.Row="1" Margin="0,71,0,0" Text="{Binding Msg}" />



                    </Grid>
                </DataTemplate>
            </callisto:LiveTile.ItemTemplate>
            <callisto:LiveTile.DataContext>
                <ViewModel:LiveTileData/>
            </callisto:LiveTile.DataContext>
        </callisto:LiveTile>

这是瓷砖的课程：

namespace Test.ViewModel
{
    public class Tile
    {
        public string Msg { get; set; }

        public Uri Image { get; set; }
    }

    public class LiveTileData
    {
        private static ObservableCollection<Tile> tileData = new ObservableCollection<Tile>();

        public static ObservableCollection<Tile> TileData
        {
            get
            {
                return tileData;
            }
        }
    }
}

Answer 1

你做的绑定不正确。您应该将LiveTile的ItemsSource绑定为ObservableCollection<Tile> TileData。此外，DataContext被传递给LiveTile本身，而不是它的模板。请查看下面的代码。

XAML

<callisto:LiveTile x:Name="liveTile2" 
    Background="#3B5998"
    ItemsSource="{Binding TileData}"
    Grid.Column="5"
    Grid.Row="1"
    Height="250"
    VerticalAlignment="Top"
    BorderBrush="White" BorderThickness="1"
    Margin="5" 
    Direction="Up">
    <callisto:LiveTile.ItemTemplate>
        <DataTemplate>
            <Grid Margin="5">
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="*" />
                    <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>

                <Image x:Name="tileImage" Source="{Binding Image}" Stretch="None"/>

                <TextBlock Foreground="White"
                    TextWrapping="Wrap"
                    TextTrimming="WordEllipsis" 
                    FontSize="14"
                    Grid.Row="1" Margin="0,71,0,0" Text="{Binding Msg}" />

            </Grid>
        </DataTemplate>
    </callisto:LiveTile.ItemTemplate>
    <callisto:LiveTile.DataContext>
        <ViewModel:LiveTileData />
    </callisto:LiveTile.DataContext>
</callisto:LiveTile>

C#

public class Tile
{
    public string Msg { get; set; }
    public Uri Image { get; set; }
}

public class LiveTileData
{
    public LiveTileData()
    {
        tileData.Add(new Tile { Msg = "Stack Overflow", Image = new Uri("http://jenswinter.com/image.axd?picture=stackoverflow-logo-250.png") });
        tileData.Add(new Tile { Msg = "Super User", Image = new Uri("http://superuser.com/content/superuser/img/logo.png") });
    }
    private static ObservableCollection<Tile> tileData = new ObservableCollection<Tile>();
    public static ObservableCollection<Tile> TileData
    {
        get
        {
            return tileData;
        }
    }
}