c# - ListView コントロールの特定の列内に図面を含むキャンバスを配置する方法は?

Question

コントロールの特定の列内にキャンバスを描画して配置する方法はListView?

私はこれを持っています：

<DataTemplate>
    <Canvas Width="60" Height="20" Background="Red" ClipToBounds="True" >
        <ContentPresenter Content="{Binding Path=Graph}" />
    </Canvas>
</DataTemplate>

と：

var canvas = new Canvas();
canvas.Children.Add(new Ellipse(){});
var items = new ObservableCollection<LvItem>() { new LvItem(){ Graph = canvas} };
myListView.ItemsSource = items;

ただしSystem.Windows.Controls.Canvas、キャンバス自体ではなく、テキストとして表示されます。

Answer 1

以下の例を確認してください。

XAML:

<ListView Name="myListView" >
    <ListView.View>
        <GridView>
            <GridViewColumn Width="140" Header="Grap">
                <GridViewColumn.CellTemplate>
                    <DataTemplate>
                        <Canvas Width="60" Height="50" Background="Red" ClipToBounds="True" >
                            <ContentPresenter Content="{Binding Path=Graph}" />
                        </Canvas>
                    </DataTemplate>
                </GridViewColumn.CellTemplate>
            </GridViewColumn>                    
        </GridView>
    </ListView.View>
</ListView>

LvItem クラス:

class LvItem
{
    public Canvas Graph { get; set; }
}

分離コード:

var canvas = new Canvas();
canvas.Children.Add(new Ellipse() { Width = 50, Height = 50, Fill = new SolidColorBrush(Colors.Yellow) });
var canvas2 = new Canvas();
canvas2.Children.Add(new Ellipse() { Width = 50, Height = 50, Fill = new SolidColorBrush(Colors.Blue) });
var items = new ObservableCollection<LvItem>() { new LvItem() { Graph = canvas }, new LvItem() { Graph = canvas2 } };
myListView.ItemsSource = items;

結果：