WPF VB.NET从数据模板中的字符串绑定图像源

Question

我的第一个 WPF 应用程序（请轻点！），我正在根据足球比赛期间的事件制作一个应用程序。所以我设置了一个 Player 类，其中一个属性是 Nationality，例如：Scotland。然后我有一个 DataTemplate，但不是显示字符串“Scotland”，而是显示国旗的图像。我所有的图片都在 Images/Countries 然后被命名为 Scotland.png 等等...

我需要绑定的数据模板中的代码行是：

<Image x:Name="Player_Nationality_Image" Margin="0,0,0,0" Grid.Column="4"Source="Images/Countries/Scotland.png" Height="14" Width="14"/>

是否有一种简单的方法可以稍微更改我的班级并仅基于此 Nationality 属性绑定图像源？我需要在两者之间进行转换吗？

这是我的 Player.vb 类：

Imports System.Collections.ObjectModel
Imports System.ComponentModel

Public Class Player
Implements INotifyPropertyChanged

Private playerFirstNameValue As String
Private playerSurnameValue As String
Private playerShirtNameValue As String
Private playerSquadNumberValue As Integer
Private playerDOBValue As Date
Private playerPlaceOfBirthValue As String
Private playerNationalityValue As String

Private playerCategoryValue As Position
Private specialFeaturesValue As SpecialFeatures

Private teamValue As ObservableCollection(Of Team)

Public Event PropertyChanged As PropertyChangedEventHandler Implements INotifyPropertyChanged.PropertyChanged



Public Property FirstName() As String
    Get
        Return Me.playerFirstNameValue
    End Get
    Set(ByVal value As String)
        Me.playerFirstNameValue = value
        OnPropertyChanged("FirstName")
    End Set
End Property

Public Property Surname() As String
    Get
        Return Me.playerSurnameValue
    End Get
    Set(ByVal value As String)
        Me.playerSurnameValue = value
        OnPropertyChanged("Surname")
    End Set
End Property

Public Property ShirtName() As String
    Get
        Return Me.playerShirtNameValue
    End Get
    Set(ByVal value As String)
        Me.playerShirtNameValue = value
        OnPropertyChanged("ShirtName")
    End Set
End Property

Public Property SquadNumber() As Integer
    Get
        Return Me.playerSquadNumberValue
    End Get
    Set(ByVal value As Integer)
        Me.playerSquadNumberValue = value
        OnPropertyChanged("SquadNumber")
    End Set
End Property

Public Property StartDate() As Date
    Get
        Return Me.playerDOBValue
    End Get
    Set(ByVal value As Date)
        Me.playerDOBValue = value
        OnPropertyChanged("DateofBirth")
    End Set
End Property

Public Property PlaceOfBirth() As String
    Get
        Return Me.playerPlaceOfBirthValue
    End Get
    Set(ByVal value As String)
        Me.playerPlaceOfBirthValue = value
        OnPropertyChanged("Surname")
    End Set
End Property

Public Property Nationality() As String
    Get
        Return Me.playerNationalityValue
    End Get
    Set(ByVal value As String)
        Me.playerNationalityValue = value
        OnPropertyChanged("Nationality")
    End Set
End Property

Public Property Position() As Position
    Get
        Return Me.playerCategoryValue
    End Get
    Set(ByVal value As Position)
        Me.playerCategoryValue = value
        OnPropertyChanged("Position")
    End Set
End Property


Public Property SpecialFeatures() As SpecialFeatures
    Get
        Return Me.specialFeaturesValue
    End Get
    Set(ByVal value As SpecialFeatures)
        Me.specialFeaturesValue = value
        OnPropertyChanged("SpecialFeatures")
    End Set
End Property

Public ReadOnly Property Team() As ReadOnlyObservableCollection(Of Team)
    Get
        Return New ReadOnlyObservableCollection(Of Team)(Me.teamValue)
    End Get
End Property


Public Sub New(ByVal FirstName As String, ByVal Surname As String, ByVal ShirtName As String, ByVal PlaceOfBirth As String, ByVal NationalityImageSourceString As String, ByVal Category As Position, ByVal squadNumber As Integer, ByVal DOB As Date, ByVal specialFeatures As SpecialFeatures)
    Me.playerFirstNameValue = FirstName
    Me.playerSurnameValue = Surname
    Me.playerShirtNameValue = ShirtName
    Me.playerPlaceOfBirthValue = PlaceOfBirth
    Me.playerNationalityValue = Nationality
    Me.playerDOBValue = DOB
    Me.playerSquadNumberValue = squadNumber


    Me.playerCategoryValue = Category
    Me.specialFeaturesValue = specialFeatures
    Me.teamValue = New ObservableCollection(Of Team)()
End Sub

Protected Sub OnPropertyChanged(ByVal name As String)
    RaiseEvent PropertyChanged(Me, New PropertyChangedEventArgs(name))
End Sub
End Class

Public Enum Position
    GK
    DF
    MF
    FW
End Enum

Public Enum SpecialFeatures
    None
    Yellow
    Red
    SubbedOff
    SubbedOn
    Highlight
End Enum

Application.xaml 中的数据模板：

<DataTemplate DataType="{x:Type src:Player}">

        <Button Name="Player_Button" Style="{StaticResource Player}" Height="24" Width="320" Margin="0,2,0,0">
            <Grid HorizontalAlignment="Center" Width="300">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="20"></ColumnDefinition>
                    <ColumnDefinition Width="210"></ColumnDefinition>
                    <ColumnDefinition Width="10"></ColumnDefinition>
                    <ColumnDefinition Width="30"></ColumnDefinition>
                    <ColumnDefinition Width="30"></ColumnDefinition>

                </Grid.ColumnDefinitions>

                <TextBlock Name="Player_Number_Text" Grid.Column="0" FontFamily="Font/#Gotham Narrow Bold" Text="{Binding Path=SquadNumber}" Margin="0,0,0,0" HorizontalAlignment="Left" />
                <StackPanel Orientation="Horizontal" Grid.Column="1">
                    <TextBlock Name="Player_FirstName_Text" FontFamily="Font/#Gotham Narrow Bold" Text="{Binding Path=FirstName}" Margin="5,0,0,0" HorizontalAlignment="Left" />
                    <TextBlock Name="Player_Surname_Text" FontFamily="Font/#Gotham Narrow Bold" Text="{Binding Path=Surname}" Margin="5,0,0,0" HorizontalAlignment="Left" />
                </StackPanel>                   
                <Rectangle Name="Player_Card" Grid.Column="2"></Rectangle>
                <TextBlock Name="Player_Position_Text" Grid.Column="3" FontFamily="Font/#Gotham Narrow Bold" Text="{Binding Path=Position}" Margin="5,0,0,0" />
                <Image x:Name="Player_Nationality_Image" Margin="0,0,0,0" Grid.Column="4" Source="Images/Countries/Scotland.png" Height="14" Width="14" />

            </Grid>
        </Button>



        <DataTemplate.Triggers>
            <DataTrigger Binding="{Binding Path=SpecialFeatures}">
                <DataTrigger.Value>
                    <src:SpecialFeatures>Yellow</src:SpecialFeatures>
                </DataTrigger.Value>
                <DataTrigger.Setters>

                    <Setter Property="Fill" Value="Yellow" TargetName="Player_Card" />


                </DataTrigger.Setters>
            </DataTrigger>
            <DataTrigger Binding="{Binding Path=SpecialFeatures}">
                <DataTrigger.Value>
                    <src:SpecialFeatures>Highlight</src:SpecialFeatures>
                </DataTrigger.Value>

                <Setter Property="Fill" Value="Blue" TargetName="Player_Card" />

            </DataTrigger>
        </DataTemplate.Triggers>
    </DataTemplate>

Answer 1

您需要实现IValueConverter。

在您的解决方案中的某处添加以下类。 （我强烈建议创建一个转换器文件夹并将整个应用程序中要使用的所有转换器转储到此文件夹中，以便您可以轻松找到并修改它们。）

Imports System.ComponentModel
Imports System.Windows.Data
Imports System.Windows.Media

Public Class StringToImageConverter
    Implements IValueConverter

    Public Sub New()
    End Sub

    Public Function Convert(value As Object, targetType As Type, parameter As Object,        culture As System.Globalization.CultureInfo) As Object _
    Implements IValueConverter.Convert

             Select Case value
            Case "Scotland"
                '
                Return New ImageSourceConverter().ConvertFromString("/YOURSOLUTION;component/Images/Countries/Scotland.png")
                '
           Case "Australia"
                '
                Return New ImageSourceConverter().ConvertFromString("/YOURSOLUTION;component/Images/Countries/Australia.png")
                '
        Case Else
                Return Nothing
        End Select

    End Function


    Public Function ConvertBack(value As Object, targetType As Type, parameter As Object, culture As System.Globalization.CultureInfo) As Object _
    Implements IValueConverter.ConvertBack

    End Function
End Class

在 Application.xaml 中放置以下代码。

 <Form.Resources>
        <my:StringToImageConverter x:Key="StringToImageConverter" />
  <Form.Resources>

 <Button Name="Player_Button" Style="{StaticResource Player}" Height="24" Width="320" Margin="0,2,0,0">
            <Grid HorizontalAlignment="Center" Width="300">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="20"></ColumnDefinition>
                    <ColumnDefinition Width="210"></ColumnDefinition>
                    <ColumnDefinition Width="10"></ColumnDefinition>
                    <ColumnDefinition Width="30"></ColumnDefinition>
                    <ColumnDefinition Width="30"></ColumnDefinition>

                </Grid.ColumnDefinitions>

                <TextBlock Name="Player_Number_Text" Grid.Column="0" FontFamily="Font/#Gotham Narrow Bold" Text="{Binding Path=SquadNumber}" Margin="0,0,0,0" HorizontalAlignment="Left" />
                <StackPanel Orientation="Horizontal" Grid.Column="1">
                    <TextBlock Name="Player_FirstName_Text" FontFamily="Font/#Gotham Narrow Bold" Text="{Binding Path=FirstName}" Margin="5,0,0,0" HorizontalAlignment="Left" />
                    <TextBlock Name="Player_Surname_Text" FontFamily="Font/#Gotham Narrow Bold" Text="{Binding Path=Surname}" Margin="5,0,0,0" HorizontalAlignment="Left" />
                </StackPanel>                   
                <Rectangle Name="Player_Card" Grid.Column="2"></Rectangle>
                <TextBlock Name="Player_Position_Text" Grid.Column="3" FontFamily="Font/#Gotham Narrow Bold" Text="{Binding Path=Position}" Margin="5,0,0,0" />
        <Image Source="{Binding Path=Nationality, Converter={StaticResource StringToImageConverter}}" Stretch="None" />

            </Grid>

希望这会有所帮助。