WPFで、矩形をListBoxに動的に追加する

概要

C# WPFアプリケーションで要素を動的に追加する方法です。 ItemsControlを使うと要素をプログラムで追加できます。ここでは、矩形要素を追加します。

要素を動的に追加する方法

[xaml]


<Window x:Class="AddRectangle.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="200" Width="300">
    <DockPanel>
        <Button DockPanel.Dock="Bottom" Click="Button_Click" >矩形を追加</Button>
        <Grid DockPanel.Dock="Top">
            <ScrollViewer>
                <ItemsControl Name="itemsRectangle">
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>
                            <Rectangle Width="144"
                                       Height="32"
                                       Margin="2">
                                <Rectangle.Fill>
                                    <SolidColorBrush Color="{Binding}"/>
                                </Rectangle.Fill>
                            </Rectangle>
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                </ItemsControl>
            
            </ScrollViewer>
        </Grid>
    </DockPanel>   
</Window>

[xaml.cs]


using System.Windows;

namespace AddRectangle
{
    /// <summary>
    /// MainWindow.xaml の相互作用ロジック
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            itemsRectangle.Items.Add("Aqua");
        }
    }
}

プログラムを実行する

ListBoxには何も表示されいません。

「矩形を追加」ボタンを押す

ボタンを押すと矩形が追加されます。

ボタンをたくさん押す。

ボタンを押しただけ、矩形が追加されます。画面内に入りきれないとスクロールバーも表示されます。

Code

参考資料

[Charls Petzold]プログラミングWindows第6版上 p512 sampleコード ColorItems

プログラミング Windows 第6版第1章 WPF編 (外部サイト)

「プログラミング Windows 第6版」の紹介記事を書いたサイトがありましたのでリンクを貼っておきます。「プログラミング Windows 第6版」はホームアプリ向けに書かれた書籍ですので、サンプルプログラムは、 VisualStudio for Desktopでは、そのままでは動作しないので注意が必要です。

動作確認環境

Microsoft Visual Studio Express 2013 for Desktop 64bit
Windows 8.1 pro 64bit

ページトップへ