如何在文本块文本更改时更改边框背景

how to change border background when textblock text changes

我在 longlistselector 中有一个绑定的文本块(比如超过 6 个),后面有一个边框。边框适用于所有文本块。这是绑定代码:

Public Sub LoadData()
    ' Sample data; replace with real data
    Me.Items.Add(New ItemViewModel() With {.LineTwo = "New Endowment Plans", .LineThree = ""})
    Me.imgsource.Add(New ItemViewModel() With {.imgsource = "/Images/endow_1.jpg"})
    Me.Items.Add(New ItemViewModel() With {.LineTwo = "New Money Back Plans", .LineThree = ""})
    Me.Items.Add(New ItemViewModel() With {.LineTwo = "Single Premium Plans"})
    Me.Items.Add(New ItemViewModel() With {.LineTwo = "New Term", .LineThree = "Plans"})
    Me.Items.Add(New ItemViewModel() With {.LineTwo = "New Health", .LineThree = "Plans"})
    Me.Items.Add(New ItemViewModel() With {.LineTwo = "New Pension", .LineThree = "Plans"})
    Me.Items.Add(New ItemViewModel() With {.LineTwo = "Withdrawl", .LineThree = "Plans"})
    Me.Items.Add(New ItemViewModel() With {.LineTwo = "Plans", .LineThree = "Information"})
End Sub

这里是 xaml 代码:

<phone:LongListSelector>
    <phone:LongListSelector.ItemTemplate>
        <DataTemplate>
            <StackPanel  Orientation="Horizontal" Margin="12,2,0,4" Height="105" Width="432" Tap="StackPanel_Tap">
                <Border x:Name="planImage" BorderThickness="5" Width="99" Height="99" BorderBrush="#FFFFC700">
                    <Border.Background>
                        <ImageBrush ImageSource="/Images/liclogo.jpg" Stretch="Fill"/>
                    </Border.Background>
                </Border>
                <StackPanel Width="311" Margin="8,-7,0,0">
                    <TextBlock x:Name="Plantype" Foreground="#FF8FF01B" Text="{Binding LineTwo }"  TextWrapping="Wrap" Margin="10,0" Style="{StaticResource PhoneTextExtraLargeStyle}" FontSize="{StaticResource PhoneFontSizeLarge}" />
                    <TextBlock Foreground="#FF8FF01B" Text="{Binding LineThree }" TextWrapping="Wrap" Margin="10,-2,10,0" Style="{StaticResource PhoneTextExtraLargeStyle}" FontSize="{StaticResource PhoneFontSizeLarge}" />
                </StackPanel>
            </StackPanel>
        </DataTemplate>
    </phone:LongListSelector.ItemTemplate>
</phone:LongListSelector>

我想更改每个边框背景图片,因为我使用的一张在所有文本块中都反映相同。

如果我理解正确的话,你希望这里的列表中的每个项目都有不同的图像。

有两种方法可以实现。

选项 1: 例如添加一个名称为 ImagePath 的新 属性(就像您有 LineTwo 和 LineThree),并分别为每个项目添加图像路径,然后将代码更改为:

<Border.Background>
    <ImageBrush ImageSource="{Binding ImagePath}" Stretch="Fill"/>
</Border.Background>

选项 2: 创建一个转换器并将其绑定到 Image 元素的图像源。 例子: 图片示例 here 可见性示例 here Microsoft 的入门示例 here


我认为最适合您的情况的解决方案是使用选项 1。直截了当,不需要任何额外的处理。但是,这将需要您拥有一个额外的字段,其中包含人们可能不同意的路径,因为它为静态图像路径保留了大量 "useless" 信息,并建议使用 Option 2!