另一个WPF画布没有显示数据绑定元素

时间:2015-12-11 00:13:07

标签: wpf xaml canvas

编辑2 :这是问题的原始版本。进行了其他修订,但这是唯一能够正确显示问题的修订版。

类似的问题:

与上面的第一个问题一样,我试图建立一个2D世界。我的精灵恰好是表示为XAML文件的矢量图形,但我怀疑这很重要。无论如何,我无法获得超越白色背景的任何东西。

我尝试将我的精灵直接添加到XAML中的画布上,并且工作正常,但我需要在程序上生成它们。我看着Snoop的窗户,发现画布实际上并没有渲染;它只是窗口本身。

为什么我的精灵不出现?

MainWindow.xaml

<Window x:Class="Canvas_test.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        x:Name="Self"
        Title="MainWindow" Height="350" Width="525">
    <ItemsControl ItemsSource="{Binding Sprites, ElementName=Self}">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <Canvas />
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemContainerStyle>
            <Style>
                <Setter Property="Canvas.Left" Value="{Binding X}" />
                <Setter Property="Canvas.Top" Value="{Binding Y}" />
            </Style>
        </ItemsControl.ItemContainerStyle>
    </ItemsControl>
</Window>

MainWindow.xaml.cs

using System.Collections.ObjectModel;
using System.Windows;

namespace Canvas_test {
    public partial class MainWindow : Window {
        public ObservableCollection<Character> Sprites { get; private set; } = new ObservableCollection<Character>();

        public MainWindow() {
            InitializeComponent();

            Sprites.Add(new Character());
        }
    }
}

Character.xaml

<Viewbox x:Class="Canvas_test.Character"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         Width="64"
         Height="64"
         Stretch="Uniform">
    <Canvas Width="64" Height="64">
        <Ellipse xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="64" Height="64" Fill="#FF0000FF"/>
        <Path xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Fill="#FFFF0000" Data="M 32 0 64 66.25 l -64 0 z" RenderTransform="0.5 0 0 0.9 16 0" />
    </Canvas>
</Viewbox>

Character.xaml.cs

using System.Windows.Controls;

namespace Canvas_test {
    public partial class Character : Viewbox {
        public double X { get; } = 100;
        public double Y { get; } = 100;
    }
}

2 个答案:

答案 0 :(得分:2)

您必须设置DataContext。 你走了:

<强> MainWindow.xaml

<Window x:Class="Canvas_test.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525"
        DataContext="{Binding RelativeSource={RelativeSource Self}}"
        >
    <ItemsControl ItemsSource="{Binding Sprites}">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <Canvas />
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
    </ItemsControl>

</Window>

MainWindow.xaml.cs 保持不变

<强> Character.xaml

<Viewbox x:Class="Canvas_test.Character"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         Width="64"
         Height="64"
         Stretch="Uniform"
         DataContext="{Binding RelativeSource={RelativeSource Self}}"
         Canvas.Top="{Binding Y}"
         Canvas.Left="{Binding X}"
         >
    <Canvas Width="64" Height="64">
        <Ellipse Width="64" Height="64" Fill="#FF0000FF"/>
        <Path Fill="#FFFF0000" Data="M 32 0 64 66.25 l -64 0 z" RenderTransform="0.5 0 0 0.9 16 0" />
    </Canvas>
</Viewbox>

Character.xaml.cs (初始化组件)

namespace Canvas_test
{
    /// <summary>
    /// Interaction logic for Character.xaml
    /// </summary>
    public partial class Character : Viewbox
    {

        public Character()
        {
            InitializeComponent();
        }

        public double X { get; } = 100;
        public double Y { get; } = 100;
    }
}

输出:

enter image description here

只是一个建议,尝试使用MVVM模式。

答案 1 :(得分:0)

您是否尝试过IsItemsHost属性?

        <ItemsPanelTemplate>
            <Canvas IsItemsHost="True"/>
        </ItemsPanelTemplate>