在wp7中使用转换器绑定图像

时间:2012-11-03 09:37:10

标签: c# windows-phone-7 xaml windows-phone-7.1

我正在使用VS2012和C#(Windows 8.0 SDK)开发Windows手机应用程序,我是新手,我使用以下代码使用Converter绑定PNG图像

xmlns:myproject="clr-namespace:SolutionName.Converters"

 <UserControl.Resources>
    <myproject:LoginHistoryImageConverter x:Key="LoginHistoryImageConverter"/>
</UserControl.Resources>

<Grid x:Name="LayoutRoot" Background="{StaticResource pivotBackground}">
        <ListBox x:Name="listBoxLogs">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid MinWidth="480" Height="88" Margin="12,0,12,0" HorizontalAlignment="Stretch">
                        <Image Width="80" Height="80" Source="{Binding device, Converter={StaticResource LoginHistoryImageConverter}}"/>
                        <StackPanel Orientation="Vertical" HorizontalAlignment="Left" Margin="85,0,0,0" VerticalAlignment="Center">
                            <TextBlock FontSize="25" Text="{Binding date}" Foreground="{StaticResource MessageListForeground}" HorizontalAlignment="Left"/>
                            <TextBlock FontSize="25" Text="{Binding ip_address}" Foreground="{StaticResource MessageListForeground}" HorizontalAlignment="Left" MaxWidth="200"/>
                        </StackPanel>
                        <StackPanel Orientation="Vertical" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="0,0,38,0">
                            <TextBlock FontSize="18" Text="{Binding time}" Foreground="{StaticResource MessageListForeground}" HorizontalAlignment="Right"/>
                            <TextBlock FontSize="18" Text="{Binding location}" Foreground="{StaticResource MessageListForeground}" HorizontalAlignment="Right" MaxWidth="200"/>
                        </StackPanel>
                    </Grid>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </Grid>

你可以观察到我是绑定图像

<Image Width="80" Height="80" Source="{Binding device, Converter={StaticResource LoginHistoryImageConverter}}"/>

我将device作为字符串“M”或“PC”,通过使用转换器,我返回BitmapImage

public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
        String text = (String)value;                        
        if (text.Equals("M"))
        {
            return new BitmapImage(new Uri("Resources/Assets/mobile.png",UriKind.Relative));
        }
        else
        {
            return new BitmapImage(new Uri("Resources/Assets/pc.png", UriKind.Relative));
        }
 }

当我收到字符串"M"时,我需要显示mobile图像其他PC图像 但是当我导航到我的页面时,会在XamlParseException处触发"InitializeComponent()",请观察图像 enter image description here

即使我尝试下面的代码绑定图像,但没有运气

<Image Width="80" Height="80">
    <Image.Source>
        <BitmapImage UriSource="{Binding device, Converter={StaticResource LoginHistoryImageConverter}}"/>
    </Image.Source>
</Image>

我有没有想念。请帮帮我

完整的XAML代码

<phone:PhoneApplicationPage
    x:Class="SampleProject.Views.Settings.Logs.LoginHistory"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:myproject="clr-namespace:SampleProject.Converters"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait" Orientation="Portrait"
    mc:Ignorable="d"
    shell:SystemTray.IsVisible="True">

    <UserControl.Resources>
        <myproject:LoginHistoryImageConverter x:Key="LoginHistoryImageConverter"/>
    </UserControl.Resources>

        <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid x:Name="LayoutRoot" Background="{StaticResource pivotBackground}">
        <ListBox x:Name="listBoxLogs">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid MinWidth="480" Height="88" Margin="12,0,12,0" HorizontalAlignment="Stretch">
                        <Image Width="80" Height="80" Source="{Binding device, Converter={StaticResource LoginHistoryImageConverter}}"/>
                        <StackPanel Orientation="Vertical" HorizontalAlignment="Left" Margin="85,0,0,0" VerticalAlignment="Center">
                            <TextBlock FontSize="25" Text="{Binding date}" Foreground="{StaticResource MessageListForeground}" HorizontalAlignment="Left"/>
                            <TextBlock FontSize="25" Text="{Binding ip_address}" Foreground="{StaticResource MessageListForeground}" HorizontalAlignment="Left" MaxWidth="200"/>
                        </StackPanel>
                        <StackPanel Orientation="Vertical" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="0,0,38,0">
                            <TextBlock FontSize="18" Text="{Binding time}" Foreground="{StaticResource MessageListForeground}" HorizontalAlignment="Right"/>
                            <TextBlock FontSize="18" Text="{Binding location}" Foreground="{StaticResource MessageListForeground}" HorizontalAlignment="Right" MaxWidth="200"/>
                        </StackPanel>
                    </Grid>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </Grid>

</phone:PhoneApplicationPage>

1 个答案:

答案 0 :(得分:0)

首先,您提供的XAML代码中存在一些问题。 pivotBackgroundMessageListForeground资源未定义,但您可能是在全局级别定义它们,例如在App.xaml中,在这种情况下应该没问题。

否则,您的代码应该有效。通过检查异常的详细信息,您可以获得有关失败的确切原因的更多信息:当发生异常时,如您在屏幕截图中显示的那样,单击“查看详细信息”,然后展开并检查{{1}的值}和Message属性:

enter image description here