[英]Combobox itemtemplate and string or comboboxitem
需要使用wpf中的comboboxitems进行小幅修复。 我想显示comboboxitems或在comboxbox(文本块)中旁边有图像。 我做不到。 有人可以帮我解决这个问题吗?
提前致谢
<ComboBox Name="avilibity" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Column="1">
<ComboBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="25"/>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Image Grid.Column="1" Source="/resources/icon.png" ></Image>
<TextBlock FontSize="14" Grid.Column="2" ></TextBlock>
</Grid>
</DataTemplate>
</ComboBox.ItemTemplate>
<sys:String>Available</sys:String>
<sys:String>Offline</sys:String>
<sys:String>Away</sys:String>
</ComboBox>
第一个问题是Grid Column索引基于0-表示图像保留具有Grid.Column =“ 0”,TextBlock =“ 1”。
应该总是相同的图像吗? 考虑将用户定义的对象用作具有绑定的属性。 因此,您可以拥有单独的图标。
可能是这里的专家之一可以提供仅XAML的示例...我只能想象后面有代码...
这里有两种可能的解决方案:
C#中的代码落后
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using System.ComponentModel;
namespace ListImageWithText
{
/// <summary>
/// Interaktionslogik für MainWindow.xaml
/// </summary>
public partial class MainWindow : Window, INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
private void OnNotifyPropertyChanged(String info)
{
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs(info));
}
}
private List<ImageWithText> _objectlist;
public List<ImageWithText> ObjectList
{
get
{
return _objectlist;
}
set
{
_objectlist = value;
OnNotifyPropertyChanged("ObjectList");
}
}
public MainWindow()
{
InitializeComponent();
ImageWithText iwt;
this._objectlist = new List<ImageWithText>();
iwt = new ImageWithText();
iwt.Image = "App.ico";
iwt.Text = "Away";
this._objectlist.Add(iwt);
iwt = new ImageWithText();
iwt.Image = "App.ico";
iwt.Text = "Available";
this._objectlist.Add(iwt);
iwt = new ImageWithText();
iwt.Image = "App.ico";
iwt.Text = "Offline";
this._objectlist.Add(iwt);
OnNotifyPropertyChanged("ObjectList");
}
}
public class ImageWithText
{
public string Image { get; set; }
public string Text { get; set; }
}
}
定义具有两个公共属性的小类,将这些对象的列表显示为属性,并在XAML中使用绑定
<ComboBox Name="avilibity"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Grid.Column="1"
ItemsSource="{Binding ObjectList, RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=Window}}">
<ComboBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="25"/>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Image Grid.Column="0" Source="{Binding Image}" />
<TextBlock FontSize="14" Grid.Column="1" Text="{Binding Text}"/>
</Grid>
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
XAML重复的最简单方法-使用ComboBox项,我不喜欢此路径。
<ComboBox Name="avilibity"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Grid.Column="1">
<ComboBoxItem>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="25"/>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Image Grid.Column="0" Source="App.ico" ></Image>
<TextBlock FontSize="14" Grid.Column="1" >Available</TextBlock>
</Grid>
</ComboBoxItem>
<ComboBoxItem>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="25"/>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Image Grid.Column="0" Source="App.ico" ></Image>
<TextBlock FontSize="14" Grid.Column="1" >Offline</TextBlock>
</Grid>
</ComboBoxItem>
<ComboBoxItem>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="25"/>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Image Grid.Column="0" Source="App.ico" ></Image>
<TextBlock FontSize="14" Grid.Column="1" >Away</TextBlock>
</Grid>
</ComboBoxItem>
</ComboBox>
您的代码中几乎没有错误:1.行和列以索引0开头; 2. TextBlock需要设置Text属性,以便它可以显示。
如果您只想显示相同的图标,则此代码将起作用(这可以解决您的问题):
<ComboBox Name="avilibity" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Column="1">
<ComboBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="25"/>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Image Grid.Column="0" Source="/resources/icon.png" ></Image>
<TextBlock FontSize="14" Grid.Column="1" Text="{Binding}"></TextBlock>
</Grid>
</DataTemplate>
</ComboBox.ItemTemplate>
<sys:String>Available</sys:String>
<sys:String>Offline</sys:String>
<sys:String>Away</sys:String>
</ComboBox>
但正如我所看到的,项目有三种状态。 也许您想在显示其他项目时更改图像。
这是我的解决方案:
<Window.Resources>
<converters:ImageSourceConverter x:Key="ImageSourceConverter" />
</Window.Resources>
<ComboBox Name="avilibity" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Column="1">
<ComboBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="25"/>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Image Grid.Column="0" Source="{Binding Converter={StaticResource ImageSourceConverter}}" />
<TextBlock FontSize="14" Grid.Column="1" Text="{Binding}"></TextBlock>
</Grid>
</DataTemplate>
</ComboBox.ItemTemplate>
<sys:String>Available</sys:String>
<sys:String>Offline</sys:String>
<sys:String>Away</sys:String>
</ComboBox>
ImageSourceConverter:
public class ImageSourceConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
return new BitmapImage(new Uri("/resources/" + value + ".png",UriKind.RelativeOrAbsolute));
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.