27章:10 行でズバリ!! [C#] リスト アイテムの表現

    作成2013.04.21

     Silverlight アプリケーションとWPFアプリケーションのコードは完全互換ではなさそうですが、わずかな修正でSilverlight アプリケーション用サンプルコードをWPFアプリケーション用コードに変換できます。
     ここでは、Silverlight アプリケーション用サンプルコードをWPFアプリケーション用コードに変換します。
     10 行でズバリ!! [C#] リスト アイテムの表現は下記の参照元情報から作成方法の説明と解説を参照できます。

  1. 参照元情報
     10 行でズバリ!! [C#] リスト アイテムの表現
    「10 行でズバリ!! [C#] リスト アイテムの表現」にジャンプする
     作成方法の詳細は上記を参照願います。


  2. 10 行でズバリ!! [C#] リスト アイテムの表現の完成ファイル
     10 行でズバリ!! [C#] リスト アイテムの表現の解説とおりに作業を実施すると、C#プロジェクトファイル群が完成しますが、 ここでは、VBで作成したプログラムをC#言語に変換を基本とします。
     完成ファイルは以下からダウンロードできます。
     ダウンロード後は解凍してから使用してください。
      [10 行でズバリ!! [C#] リスト アイテムの表現]をダウンロードする。
     解凍すると「27ListItems」フォルダーがあります。
    注(1)「27ListItems」フォルダーの「ListItems.sln」ファイルをダブルクリックすると「Express 2012 for Windows Desktop」が起動します。
    注(2)メニューの「ウインド」_「ウインドレイアウトのリセット」で標準に戻ります。
    注(3)「ソリューションエクスプローラ」ウインドウ内の「MainWindow.xaml」をダブルクリックすると「デザイン」が表示されます。
    注(4)メニューの「表示」_「コード」を選択するとコードが表示されます。
    注(5)「ListItems.sln」の動作確認は「デバッグ」_「デバッグ開始」で実行します。デバッグ機能を用いて動作確認を行います。


  3. ListItems.slnの実行
    (1)「Express 2012 for Windows Desktop」のデバッグ機能を使用します。
    (2)「デバッグ」_「デバッグ開始」を選択します。
    (3)操作画面が表示されます。
    (4)動作確認はありません。
    (5)クローズボックスで終了します。


  4. 新規プロジェクトの作成
    (1)MainWindow.xamlのデザイン設定
     新規プロジェクトを作成すると「デザイナー」にはMainWindow.xamlが自動生成されます。MainWindow.xamlのデザイン設定はVBのMainWindow.xamlのコピー&ペーストで完成します。

    (2) MainWindow.xaml.csコード
     基本コードが自動生成されます。


  5. MainWindow.xamlの全コード
    <Window x:Class="MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="190" Width="670">
        <Grid x:Name="LayoutRoot" >
            <ListBox x:Name="listColors" Height="120" >
                <ListBox.ItemsPanel>
                    <ItemsPanelTemplate>
                        <StackPanel Orientation="Horizontal" />
                    </ItemsPanelTemplate>
                </ListBox.ItemsPanel>
    
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <Grid Width="100">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto" />
                                <RowDefinition Height="*" />
                            </Grid.RowDefinitions>
                            <TextBlock Grid.Row="0" Text="{Binding Name}" />
                            <Ellipse Grid.Row="1" Fill="{Binding Brush}"  Height="80"/>
                        </Grid>
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>
        </Grid>
    </Window>
    


  6. MainWindow.xaml.csの全コード
     using System.Linq;
    using System.Windows;
    using System.Windows.Media;
    namespace ListItems
    {
        public partial class MainWindow : Window
        {
            public MainWindow()
            {
                InitializeComponent();
                var ColorList = from c in typeof(Colors).GetProperties() select new ColorItem { Name = c.Name, Color = (Color)c.GetValue(null, null) };
                listColors.ItemsSource = ColorList;
            }
        }
    
        public class ColorItem
        {
            public string Name { get; set; }
            public Color Color { get; set; }
            public Brush Brush
            {
                get { return new SolidColorBrush(Color); }
            }
        }
    }
    


  7. MainWindow.xaml.csコードの解説
    (1)Text="{Binding Name}" と Fill="{Binding Brush}" に対応するリストデータを作成します。
    (2)図形の色を直接指定できないようです。(ソリッドブラシで指定するようです。)



    感想:
    (1)class ColorItemの記述がC#ほうが簡潔な気がします。
    (2)public string Name { get; set; }→public string Name;としても同じです。(どちらにするかは好みです。)







28章:10 行でズバリ!! [C#] コントロール間の連携に行く。

トップページに戻る。