扑克牌用了一个自定义控件,代码如下
public class CardButton : Button { public int state;//是否翻转0是未翻转，1是已翻转 private static CardButton button; public CardButton() { this.DefaultStyleKey = typeof(CardButton); // this.Click += CardButton_Click; }
主要是继承了button控件然后增加了一个属性，记录牌是否翻转,然后修改了样式
<Style
TargetType="local:CardButton">
<Setter
Property="Template">
<Setter.Value>
<ControlTemplate
TargetType="local:CardButton">
<!--<Border Background="{TemplateBinding
Background}"
BorderBrush="{TemplateBinding
BorderBrush}"
BorderThickness="{TemplateBinding
BorderThickness}">
</Border>-->
<Grid
x:Name="RootElement">
<!--<Rectangle x:Name="BodyElement" Width="260"
Height="100"
Fill="Lavender" Stroke="Purple" RadiusX="16" RadiusY="16"
/>-->
<!--<TextBlock Text="{TemplateBinding Content}"
HorizontalAlignment="Center"
VerticalAlignment="Center"
/>-->
<Image Source="{TemplateBinding Content}" Width="100"
/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
页面上使用了一个wrappanel控件，实现流布局来展示牌
主页面核心代码如下
private void InitData() { count = 16; int[] j = new int[16] { 2, 6, 3, 6, 1, 5, 0, 3, 1, 7, 5, 0, 2, 4, 7, 4 }; Random r=new Random(); List<int> arr= j.OrderBy(x=>r.Next()).ToList<int>(); for (int i = 0; i < 16; i++) { CardButton button = new CardButton(); button.state = 0; button.Name = "btn" + i; button.Content = "image/card.jpg"; button.Tag = arr[i].ToString(); button.Click += button_Click; Content.Children.Add(button); list.Add(button); } }
然后定义图片点击事件,两张相同的图片则消失,当点开第3张的时候,前2张翻转过来
void button_Click(object sender, RoutedEventArgs e) { CardButton b = (CardButton)sender; b.state = 1; b.Content = "image/" + b.Tag + ".jpg"; ; if (list.Count(btn => btn.state == 1) >= 3) { foreach (CardButton item in list.Where(btn => btn.state == 0 || btn.state == 1)) { item.Content = "image/card.jpg"; item.state = 0; } b.state = 1; return; } foreach (CardButton item in list.Where(btn=>btn.state==1)) { if (b.Tag.ToString()==item.Tag.ToString()&&b.Name!=item.Name) { count = count - 2; b.Dispose(); item.Dispose(); } } #region 游戏结束 if (count<=0) { MessageBox.Show("恭喜你，太聪明了，闯关成功"); } #endregion }