1

私はブラックジャック プログラムを構築しており、現在ハンド ディスプレイに取り組んでいます。

カードを表示するために、内部に ItemsControl を持つ PlayerSeat UserControl があります。ブラックジャックの通常のゲームと同様に、カード (私の場合は画像) が互いに重ねられます。さまざまなゲーム アクション (スプリット、ダブル ダウンなど) では、画面上のカードのレイアウトを変更する必要があります。ItemsControl の ItemSource プロパティはObservableCollection<Card> Hand、プレーヤーの ViewModel の " " プロパティです。Card オブジェクトには、Card イメージを含む BitmapSources が含まれています。

私が望むものを達成する方法について、いくつかのWebページ（投稿の最後を参照）に目を通しました。2つのオプションのうちの1つを行う方法を探しています。

  1. (推奨) 各「ハンド モード」(スプリット、ダブル ダウンなど) のレイアウトを指定し、ハンド ( OC<Card>) の各インデックスを配置する場所を指定します。たとえば、ハンドの最初のカードの場合、ソースが Hand[0].CardImage にバインドされた Image コントロールを (X1, Y1) に配置し、次に Hand[1] Image を (X2, Y2) に配置します。これは、ItemsControl で何らかのバインドされたテンプレート プロパティ (ハンド モード間で変更するため) を設定することによって最適に調整できます。

  2. (フォールバック) Source プロパティがバインドされたすべての Image コントロールを表示します。これらの画像の Top/Left プロパティを Hand[0].Top/Left にバインドし、Hand クラスで配置計算を行います。

私は自分で問題を調査せずに質問する人ではありません。StackPanel で ItemsPanelTemplate を使用する必要があるようですが、どこから始めればよいかわかりません。重要なのは、画像を重ねて、必要な場所に配置することです。あなたが私の問題に当てることができる光は役に立ちます.

参照: http://drwpf.com/blog/itemscontrol-a-to-z/ (具体的には「ItemsControl: 'P' は Panel 用です」)

4

2 に答える 2

4

Canvas を として使用できますItemsPanelTemplateか? 何かのようなもの：

<ItemsControl ItemsSource="{Binding Hand}">
  <ItemsControl.ItemsPanel>
    <ItemsPanelTemplate>
      <Canvas />
    </ItemsPanelTemplate>
  </ItemsControl.ItemsPanel>
  <ItemsControl.ItemTemplate>
    <DataTemplate>
      <Image Source="{Binding Image}" Width="{Binding ImageWidth}" Height="{Binding ImageHeight}" />
    </DataTemplate>
  </ItemsControl.ItemTemplate>
  <ItemsControl.ItemContainerStyle>
    <Style>
      <Setter Property="Canvas.Left" Value="{Binding ImageX}" />
      <Setter Property="Canvas.Top" Value="{Binding ImageY}" />                    
    </Style>
  </ItemsControl.ItemContainerStyle>
</ItemsControl>

これは、クラスに位置プロパティがあることを前提としていますHand。これが適切でない場合HandViewModelは、インスタンスを含むラッパーを作成しHand、表示目的でのみ使用されるこれらの追加の X、Y プロパティを作成できます。これらのプロパティの戻り値は、現在の「ハンド モード」に基づいて変わる可能性があります。

于 2011-02-07T10:56:31.003 に答える
0

ビューを適切に設計すれば、ビューモデルはカードの物理的な位置について何も知る必要はありません。これは非常に簡単な例です。私が作成したデフォルトのスタイルは、それらの大きさと、（負のマージンを介して）積み重ねたときにどのように重なり合うかを制御しますTextBlock。BorderはレイアウトItemsControlに水平StackPanelを使用します。

このアプローチを採用すると、アイテム コントロールをビュー内の必要な場所に配置できます (私なら、ドック パネルとマージンを組み合わせて整理します)。また、ビュー モデルに別のコレクションを含めることもできます。バインドする各項目コントロール。

もう少し複雑かもしれませんが、カード オブジェクトの単一のコレクションを持ち、それぞれをカードのいくつかのプロパティでフィルター処理された にバインドすることもItemsControlできますItemsSource。CollectionViewこれの良いところは、そのプロパティの値を変更するだけで、カードをある場所から別の場所に「移動」できることです。

どちらの場合でも、アイテム コントロールでコンテンツのレイアウトを管理するようにすると、ビュー モデルに触れることなく、ビュー内でアイテム コントロールを自由に移動できることがわかります。

<Page
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <Page.Resources>
  <Style TargetType="TextBlock">
    <Setter Property="Height" Value="150"/>
    <Setter Property="Width" Value="100"/>
  </Style>
   <Style TargetType="Border">
    <Setter Property="BorderBrush" Value="Black"/>
    <Setter Property="BorderThickness" Value="1"/>
    <Setter Property="Background" Value="Lightgray"/>
    <Setter Property="Margin" Value="0, 0, -80, 0"/>
    </Style>
   </Page.Resources>
  <StackPanel>  
    <ItemsControl>
      <ItemsControl.ItemsPanel>
       <ItemsPanelTemplate>
        <StackPanel Orientation="Horizontal"/>
       </ItemsPanelTemplate>
      </ItemsControl.ItemsPanel>
      <Border>
       <TextBlock Text="Foo"/>
      </Border>
      <Border>
       <TextBlock Text="Bar"/>      
      </Border>
      <Border>
       <TextBlock Text="Baz"/>      
      </Border>
    </ItemsControl>
  </StackPanel>
</Page>
于 2011-02-08T03:28:04.253 に答える