将图像路径绑定到UWP ListView项中的图像

本文关键字：图像 ListView 路径 绑定 UWP | 更新日期: 2023-09-27 17:59:50

尝试通过image.Source和UriSource将我的ImagePath字符串绑定到名为BusinessLineList的列表中的image元素。当我在XAML中硬编码一个图像路径时，它可以工作，但当绑定到ImagePath属性时就不行了。

这是型号：

public class BusinessLinesModel 
    {
        public string ImagePath { get; }
        public string ProductType { get; }
        public int NumPending { get; }
        public double DollarAmount { get; }
        public int NumInforceYTD { get; }
        public int ID { get; }

        public BusinessLinesModel(int id, string imagePath, string productType, int numPending, double dollarAmount, int numInforceYTD)
        {
            ID = id;
            ImagePath = imagePath;
            ProductType = productType;
            NumPending = numPending;
            DollarAmount = dollarAmount;
            NumInforceYTD = numInforceYTD;
        }
    }

以下是ViewModel代码：

    private AgentsModel _selectedAgent;
    public AgentsModel SelectedAgent
    {
        get { return _selectedAgent; }
        set
        {
            _selectedAgent = value;
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(SelectedAgent)));
            IsAgentSelected = Visibility.Visible;
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(IsAgentSelected)));

            int i = SelectedAgent.ID;
            BusinessLineList = new List<BusinessLinesModel>();
            BusinessLineList.Add(new BusinessLinesModel(i, "Assets/lifebuoy2.png", "Life", i * i + i, i * 83.22, i * 7 + 2));
            BusinessLineList.Add(new BusinessLinesModel(i, "Assets/get-money.png", "Annuities", i * i + i, i * 83.22, i * 7 + 2));
            BusinessLineList.Add(new BusinessLinesModel(i, "Assets/old-man-walking-with-a-crutch.png", "LTC", i * i + i, i * 83.22, i * 7 + 2));
            BusinessLineList.Add(new BusinessLinesModel(i, "Assets/wheelchair2.png", "Disability", i * i + i, i * 83.22, i * 7 + 2));
            BusinessLineList.Add(new BusinessLinesModel(i, "Assets/link-symbol.png", "Linked Benefit", i * i + i, i * 83.22, i * 7 + 2));
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(BusinessLineList)));

            IsBusinessLineSelected = Visibility.Collapsed;
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(IsBusinessLineSelected)));
        }
    }

这是XAML：

                            <ListView x:Name="listView1" ItemTemplate="{StaticResource CasesListModelTemplate}" ItemsSource="{Binding BusinessLineList}" SelectedItem="{Binding SelectedBusinessLine, Mode=TwoWay}" Visibility="{Binding IsAgentSelected, Mode=TwoWay}" ScrollViewer.VerticalScrollBarVisibility="Auto"/>

这是XAML中的ItemTemplate：

    <DataTemplate x:Key="CasesListModelTemplate">
        <Grid Margin="10" Width="290" Height="100" >
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <Image Margin="0,10,0,0" d:LayoutOverrides="LeftPosition, RightPosition, TopPosition, BottomPosition" Width="75" Height="75" HorizontalAlignment="Center" VerticalAlignment="Top">
                <Image.Source>
                    <BitmapImage UriSource="{Binding ImagePath}"/>
                    <!--Hard-coding this in line above works: "Assets/lifebuoy2.png"-->
                </Image.Source>
            </Image>
            <            </Grid>
    </DataTemplate>

将图像路径绑定到UWP ListView项中的图像

首先，像这个一样添加ms-appx:///

"ms-appx:///Assets/lifebuoy2.png"

第二，您可以直接设置ImageSource：

<Image Source="{Binding ImagePath}"/>
相关文章：