Windows Phone侧边栏WP8 xaml中的自定义标题

时间:2015-03-19 16:26:32

标签: c# xaml windows-phone-8

我的情景是: 我想要一个自定义标题,其中包含一个图像和一个标题标题(文本)动态的数据上下文或最好的方式可以在我的图像中完成: enter image description here

主页Xaml.cs:

 <sidebar:SidebarControl x:Name="sidebarControl" 
                            HeaderBackground="#8E8E93"
                            HeaderForeground="White"
                            SidebarBackground="#ffffff" DataContext="{Binding d}">
        <sidebar:SidebarControl.HeaderTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal">
                    <Image Margin="5" Source="{Binding Path=ImageSource}" Width="48" Height="48"/>
                    <TextBlock Foreground="Red" Text="{Binding Path=Name}" Width="200"></TextBlock>
                </StackPanel>
            </DataTemplate>
        </sidebar:SidebarControl.HeaderTemplate>

        <sidebar:SidebarControl.Background>
            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="Black" Offset="0"/>
                <GradientStop Color="#FF9DA3AE" Offset="1"/>
            </LinearGradientBrush>
        </sidebar:SidebarControl.Background>
        <sidebar:SidebarControl.SidebarContent>

            <StackPanel></StackPanel>
        </sidebar:SidebarControl.SidebarContent>

    </sidebar:SidebarControl>

我的.CS文件代码,请看一下,让我知道如何解决它

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Navigation;
using Microsoft.Phone.Controls;
using Microsoft.Phone.Shell;
using sidebar.Resources;

namespace sidebar
{
    public partial class MainPage : PhoneApplicationPage
    {
        // Constructor
        public MainPage()
        {
            InitializeComponent();
            Demo d = new Demo() { Name = "Custom Header", ImageSource = "/Assets/Images/Favorite.png" };
            sidebarControl.DataContext = d;
        }
    }
    public class Demo
    {
        public string Name { get; set; }
        public string ImageSource { get; set; }
    }
}

1 个答案:

答案 0 :(得分:0)

替换下一个代码

<StackPanel Orientation="Horizontal">
                    <Image Margin="5" Source="{Binding Path=ImageSource}" Width="48" Height="48"/>
                    <TextBlock Foreground="Red" Text="{Binding Path=Name}" Width="200"></TextBlock>
                </StackPanel>

进行下一次修改:

<StackPanel Orientation="Horizontal">
                    <Image Margin="5" Source="{Binding ImageSource}" Width="48" Height="48"/>
                    <TextBlock Foreground="Red" Text="{Binding Name}" Width="200"></TextBlock>
                </StackPanel>