0

Panorama.TitleTemplate プロパティとそれにデータをバインドするための辞書を使用して、パノラマ ページのタイトル領域をカスタマイズしようとしましたが、成功しませんでした。私のXAMLコードは次のとおりです。

<Grid x:Name="LayoutRoot">
    <controls:Panorama Name="siteHubPanoramaControl">
        <controls:Panorama.TitleTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal" Height="75" Margin="0,75,0,0" Width="470" DataContext="{Binding}">
                    <Image Source="{Binding imageSource}" />
                    <TextBlock Text="{Binding name}" />
                </StackPanel>
            </DataTemplate>
        </controls:Panorama.TitleTemplate>

        <!--Panorama item one-->
        <controls:PanoramaItem Header="Site Info">
            <Grid/>
        </controls:PanoramaItem>

        <!--Panorama item two-->
        <controls:PanoramaItem Header="Others">
            <Grid/>
        </controls:PanoramaItem>
    </controls:Panorama>
</Grid>

次のコードを使用して、ディクショナリをデータ テンプレートにバインドします。

Dictionary<string, string> dictionary = new Dictionary<string, string>();
dictionary.Add("name", this.name);
dictionary.Add("imageSource", "http://...");

siteHubPanoramaControl.DataContext = dictionary;

解決策を探していましたが、見つかりませんでした。この問題についてお役に立てれば幸いです。

また、データバインディングについて学ぶための良い情報源はありますか?

前もって感謝します...

4

1 に答える 1

1

も もプロパティではありませんname。imageSourceそれはあなたの辞書の鍵です。そのため、これら 2 つをバインドしようとすると、それらの名前のプロパティが見つかりませんでした。

これらの値をプロパティに公開する必要があります。例えば、

public string Name
{
    get { return dictionary["name"]; }
}

他の方法はわかりませんが、それが私の考えです。それはうまくいくはずです。

編集：

MVVM パターンを使用していると仮定すると、以下のコードが機能するはずです。

ビューモデル

    public class MainPageViewModel
    {
        private Dictionary<string,string> _dictionary = new Dictionary<string, string>();

        public MainPageViewModel()
        {
            _dictionary.Add("name", "Foo");
            _dictionary.Add("imageSource", "http://");
        }

        public string Name
        {
            get { return _dictionary["name"]; }
        }

        public string ImageSource
        {
            get { return _dictionary["imageSource"]; }
        }
    }

分離コード

public partial class MainPage : PhoneApplicationPage
{
    private MainPageViewModel _vm;
    // Constructor
    public MainPage()
    {
        InitializeComponent();

        _vm = new MainPageViewModel();
        DataContext = _vm;
    }
}

XAML

<Grid x:Name="LayoutRoot">
    <phone:Panorama Name="siteHubPanoramaControl">
        <phone:Panorama.Title>
            <StackPanel Orientation="Horizontal">
                    <Image Source="{Binding ImageSource}"/>
                    <TextBlock Text="{Binding Name}" />
                </StackPanel>
        </phone:Panorama.Title>
        <!--Panorama item one-->
        <phone:PanoramaItem Header="Foo">
            <Grid/>
        </phone:PanoramaItem>

        <!--Panorama item two-->
        <phone:PanoramaItem Header="Others">
            <Grid/>
        </phone:PanoramaItem>
    </phone:Panorama>
</Grid>

XAML の場合は、 を使用Panorama.TitleTemplateして適用する代わりに、代わりにDataTemplate使用Panorama.Titleするとより簡単になります。で試してみましTitleTemplateたが、タイトルをバインドすることしかできませんが、画像はバインドできません。したがって、最も簡単な回避策は を使用することPanorama.Titleです。

于 2013-03-30T16:08:35.050 に答える