Question

我正在制作一个带有按钮的用户控件。按钮有文字和图像。

listview绑定到MyType的observablecollection。将项目添加到列表等工作正常，并在运行应用程序时可见。但我也想为这些属性提供设计时支持。

我做错了什么？谢谢你的帮助。

usercontrol.xaml

Optional(<7b226970 223a2239 322e3130 332e3130 362e3838 227d>)
{
    ip = "92.103.106.88";
}

usercontrol.cs

<ListView HorizontalAlignment="Stretch" VerticalAlignment="Stretch" ItemsSource="{Binding Items}" BorderBrush="{x:Null}" >
                <ListView.ItemTemplate>
                    <DataTemplate DataType="client:MyItem">
                        <StackPanel>
                            <Button  HorizontalContentAlignment="Left" >
                                <StackPanel>
                                    <TextBlock Text="{Binding Path=ButtonText}" />
                                    <Image Source="{Binding Path=ImagePath}"></Image>
                                </StackPanel>
                                </Button>
                        </StackPanel>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>

MyItem.cs

 public UserControl1()
    {
        InitializeComponent();
        this.DataContext = this;

    }

public partial class UserControl1 : UserControl
{
    private ObservableCollection<MyItem> _items = new ObservableCollection<MyItem>();


    [Description("Items in sidebar")]
    [Category("Data")]
    [DesignerSerializationVisibility(DesignerSerializationVisibility.Content)]
    public ObservableCollection<MyItem> Items
    {
        get { return _items; }
    }
}

用户控件的用法

[Serializable()]
public  class MyItem 
{

   public string ButtonText { get; set; }
   public ImageSource Imagepath { get; set; }

}

Answer 1

适合我（图片不存在，但这不重要）：

UserControl1.xaml.cs：

using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
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;

namespace UnrelatedTests
{
    [Serializable()]
    public  class MyItem 
    {

       public string ButtonText { get; set; }
       public ImageSource Imagepath { get; set; }

    }

    public partial class UserControl1 : UserControl
    {
        public UserControl1()
        {
            InitializeComponent();
            this.DataContext = this;
        }
        private ObservableCollection<MyItem> _items = new ObservableCollection<MyItem>();


        [Description("Items in sidebar")]
        [Category("Data")]
        [DesignerSerializationVisibility(DesignerSerializationVisibility.Content)]
        public ObservableCollection<MyItem> Items
        {
            get { return _items; }
        }
    }
}

UserControl1.xaml：

<UserControl x:Class="UnrelatedTests.UserControl1"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:unrelatedTests="clr-namespace:UnrelatedTests"
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    <ListView HorizontalAlignment="Stretch" VerticalAlignment="Stretch" ItemsSource="{Binding Items}" BorderBrush="{x:Null}" >
        <ListView.ItemTemplate>
            <DataTemplate DataType="unrelatedTests:MyItem">
                <StackPanel>
                    <Button  HorizontalContentAlignment="Left" >
                        <StackPanel>
                            <TextBlock Text="{Binding Path=ButtonText}" />
                            <Image Source="{Binding Path=Imagepath}"></Image>
                        </StackPanel>
                    </Button>
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</UserControl>

MainWindow.xaml：

<Window x:Class="UnrelatedTests.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:my="clr-namespace:UnrelatedTests"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <my:UserControl1>
            <my:UserControl1.Items>
                <my:MyItem ButtonText="test" Imagepath="../img.png" />
                <my:MyItem ButtonText="test2" Imagepath="../img2.png" />
            </my:UserControl1.Items>
        </my:UserControl1>
    </Grid>
</Window>

<强>更新

如果您将MyItem设为struct而不是类，则设计时预览几乎是实时的。

Answer 2

当我想要项目模板的设计时可见性时，我使用如下硬编码项创建控件：

<ListBox>
    <ListBoxItem>
        <Grid>
            <Button/>
        </Grid>
    </ListBoxItem>
</ListBox>

然后简单地将硬编码的项目内容重构为模板：

<ListBox>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <Grid>
                <Button/>
            </Grid>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

易。

WPF设计时支持具有自定义对象的列表

2 个答案: