UIの実装、最善のルートを取る

Question

私は実装にいくつかの支援が必要な小さなアプリケーションに取り組んでいます。私はWPFで仕事をしています。そのうちの新しくなっているので、私と一緒に裸にしてください。

要点は、同じ列のような構造の動的な番号を格納するグリッドのようなコンテナを作成することです。各列のような構造の中には、ユーザーが対話できるいくつかのテキストフィールドとラジオボタンがあります。

私はいくつかの異なるWPFオブジェクトを探していますが、これは助けになるかもしれませんが、かなり圧倒されています。

私が考えてきたいくつかのものは：

• 柱状構造は、カスタム構築されたユーザーコントロールすることができます。このUserControlには、さまざまなボタンとテキストフィールドのやりとりを扱うすべてのロジックがあります。
• これらのUserControlを格納するために、水平に設定されたStackPanelを使用できます。私が集めたことから、StackPanelは私の目的にとって完璧なコンテナかもしれないようです。

私が持っているいくつかの質問：

• が、私は、ユーザーコントロールのための.xamlを作成する必要がありますか？

• 表示できるUserControlがさらに追加された場合、StackPanelは水平スクロールバーで左から右にスクロールする方法を提供しますか？

• UserControlのサイズをカスタム定義する必要がありますか、または設定した幅を指定してStackPanelの高さを使用することはできますか？

• もっと簡単で適切なソリューションはありますか？

最後に、私は私が何を探しています何の視覚的なアイデアを提供するために、非常にラフスケッチを含めました：

Answer 1

私はあなたの質問に答えることを試みる。

1. あなたは間違いなく、複数回使用されるコントロールの各部分のコントロールを抽出する必要があります。

スタックパネルは、コンテナであるHTMLでdivと同様です。スクロールを表示する場合は、Stackpanelの代わりにScrollViewerを使用することをお勧めします。

StackPanel/ScrollViewerの高さが設定されている場合、それらのコントロールは実際に子要素の高さを明示的に設定しないかぎり、その制限を尊重します。 Stackpanel/ScrollViewerの高さが設定されていない場合、子要素が引き伸ばされます（親に収まるように、高さを指定する必要があります）。しかし、あなたはそれをやりたいと思う方法を決めることができます。

私は、各冗長部分のコントロールを抽出し、ScrollViewerを使用するのは神のソリューションだと思います！

何か不明な点がありましたら、お知らせください。幸運:)

Answer 2

私はWPFでうまくいくMVVMパターンについて少し読んで始めます。それ以外の場合、私は水平スタックパネルとscrollviewerの代わりにListViewを使用します。自分のデータが横方向よりも縦方向に伸びることを望みます。使用するサンプルコードをいくつか示します。

はここにあなたのモデルクラスだ：

public enum CustomOption 
{ 
    Option1, 
    Option2, 
    Option3 
} 

public class Item 
{ 
    public string Value1 { get; set; } 

    public string Value2 { get; set; } 

    public string Value3 { get; set; } 

    CustomOption Option { get; set; } 
} 

ここにあなたのViewModelです：

public class MainWindowVM 
{ 
    public ObservableCollection<Item> Items { get; set; } 
} 

そしてここでは、あなたのメインウィンドウです：

<ScrollViewer 
    <ListView ItemsSource="{Binding Items}"> 
     <ListView.Resources> 
      <ObjectDataProvider x:Key="EnumValues" MethodName="GetValues" ObjectType="{x:Type System:Enum}"> 
       <ObjectDataProvider.MethodParameters> 
        <x:Type TypeName="local:CustomOption"/> 
       </ObjectDataProvider.MethodParameters> 
      </ObjectDataProvider> 
     </ListView.Resources> 
     <ListView.ItemTemplate> 
      <DataTemplate> 
       <StackPanel Orientation="Horizontal"> 
        <TextBlock Text="Value1" Margin="5"/> 
        <TextBox Text="{Binding Value1}" Margin="2"/> 
        <TextBlock Text="Value2" Margin="5"/> 
        <TextBox Text="{Binding Value2}" Margin="2"/> 
        <TextBlock Text="Value3" Margin="5"/> 
        <TextBox Text="{Binding Value3}" Margin="2"/> 
        <TextBlock Text="Option" Margin="5"/> 
        <ComboBox ItemsSource="{Binding Source ={StaticResource EnumValues}}" SelectedItem="{Binding Option}" Margin="5"/> 
       </StackPanel> 
      </DataTemplate> 
     </ListView.ItemTemplate> 
    </ListView> 
</ScrollViewer> 

これは、あなたが始めるために非常に単純化した例です。あなたはもっとよく見えるスタイルとレイアウトを得るために遊ぶことができます。私は嫌いなRadioButtonsの代わりにComboBoxを使用しました。また、MainWindowのDataContextをMainWindowVMとして設定する必要があります。今のところあなたのアプリケーションが始まるときにそれを行うことができます。