Silverlight+WCF 实战-网络象棋最终篇之房间装修-Silverlight端[带第九阶段源码](三)

2年前 (2022) 程序员胖胖胖虎阿

149 0 0

在线演示地址：Silverlight+WCF 新手实例象棋在线演示

上一系列四十篇索引：Silverlight+WCF 新手实例象棋专题索引

本篇紧接着上一篇：Silverlight+WCF 实战-网络象棋最终篇之房间装修-WCF端(二)

继续为房间进行如下的装修：

Silverlight+WCF 实战-网络象棋最终篇之房间装修-Silverlight端[带第九阶段源码](三)

代码实现[Silverlight端]

说明：

由于更换背景引入图片，房间的属性发生了较大的变化，由此引发了客户端房间类较大的改动。

1：Silverlight端：GameRoom类大调整[被注释的是原来的代码，未注释的是修改的代码]

由于房间本次装修的变化较大，成本也是不低的。

a：增加的全局变量

TextBlock redText;//红色玩家文字
TextBlock blackText;//黑色玩家文字
private SolidColorBrush defaultBrush = new SolidColorBrush(Color.FromArgb(0, 0, 0, 0));//默认透明的背景色

b：增加的属性[同样删除两个字段RedPlayerInChair/BlackPlayerInChair]

Silverlight+WCF 实战-网络象棋最终篇之房间装修-Silverlight端[带第九阶段源码](三)

        ///// <summary>
        ///// 红色座位有人
        ///// </summary>
        //public bool RedPlayerInChair
        //{
        //    get;
        //    set;
        //}
        ///// <summary>
        ///// 黑色座位有人
        ///// </summary>
        //public bool BlackPlayerInChair
        //{
        //    get;
        //    set;
        //}
        public bool IsGaming
        {
            get;
            set;
        }
        public GameService.Player RedPlayer
        {
            get;
            set;
        }
        public GameService.Player BlackPlayer
        {
            get;
            set;
        }
        /// <summary>
        /// 背景图片[还没玩游戏]
        /// </summary>
        public ImageBrush BackgroundBrush
        {
            get;
            set;
        }
        /// <summary>
        /// 背景图片[游戏中]
        /// </summary>
        public ImageBrush GamingBrush
        {
            get;
            set;
        }

c：调整构造函数，增加背景图传入[由于背景图片引入，原来的长方形房间变成正方形，由此改变了部分算法]

        public GameRoom(int roomID, Point location, int width, ImageBrush background, ImageBrush gaming)
        {
            RoomHeight=RoomWidth = width;
            RoomID = roomID;
            InitPoint = location;
            BackgroundBrush = background;
            GamingBrush = gaming;
        }

d：绘房间和重绘房间函数，直接把以前的注释掉，写个新了

Draw/ReDraw函数

        private void Draw()
        {
            redChair = new Rectangle()
            {
                Width = 32,
                Height = 32,
                Fill = defaultBrush,
                Margin = new Thickness(12, 58, 0, 0)
            };
            redText = new TextBlock()
            {
                FontFamily = new FontFamily("宋体"),
                FontSize = 12,
                Margin = new Thickness(10, 100, 0, 0)
            };
            spectatorChair = new Rectangle()
            {
                Width = RoomWidth / 3,
                Height = RoomWidth / 3,
                Fill = defaultBrush,
                Margin = new Thickness(RoomWidth / 3, RoomHeight / 3, 0, 0)
            };
            blackChair = new Rectangle()
            {
                Width = redChair.Width,
                Height = redChair.Height,
                Fill = defaultBrush,
                Margin = new Thickness(106, 58, 0, 0)
            };
            blackText = new TextBlock()
            {
                FontFamily = new FontFamily("宋体"),
                FontSize = 12,
                Margin = new Thickness(84, 20, 0, 0)
            };
            TextBlock text = new TextBlock()
            {
                Foreground = new SolidColorBrush(Colors.White),
                Text = "- " + RoomID + " -",
                FontFamily = new FontFamily("宋体"),
                FontSize = 12,
                Margin = new Thickness(54, 130, 0, 0)
            };

            room = new Canvas()
            {
                Width = RoomWidth,
                Height = RoomHeight,
                Margin = new Thickness(InitPoint.X, InitPoint.Y, 0, 0),
                Background = BackgroundBrush,
                Opacity = 0.8
            };
            redChair.MouseLeftButtonDown += new MouseButtonEventHandler(redChair_MouseLeftButtonDown);
            blackChair.MouseLeftButtonDown += new MouseButtonEventHandler(blackChair_MouseLeftButtonDown);
            spectatorChair.MouseLeftButtonDown += new MouseButtonEventHandler(spectatorChair_MouseLeftButtonDown);

            room.Children.Add(redChair);
            room.Children.Add(blackChair);
            room.Children.Add(spectatorChair);

            room.Children.Add(text);
            room.Children.Add(redText);
            room.Children.Add(blackText);
            container.Children.Add(room);
        }
        public void ReDraw()
        {
            if (RedPlayer != null)
            {
                redChair.Fill = GetPlayerBrush(RedPlayer.Head);
                redText.Text = RedPlayer.NickName;
                //redChair.Effect= new System.Windows.Media.Effects.Effect().
            }
            else
            {
                redChair.Fill = defaultBrush;
                redText.Text = "";
            }
            if (BlackPlayer != null)
            {
                blackChair.Fill = GetPlayerBrush(BlackPlayer.Head);
                blackText.Text = BlackPlayer.NickName;
            }
            else
            {
                blackChair.Fill = defaultBrush;
                blackText.Text = "";
            }

room.Background = IsGaming ? GamingBrush : BackgroundBrush;
}

e：新增加的取用户头像图片的函数

        private ImageBrush GetPlayerBrush(string head)
        {
            ImageBrush headBrush = new ImageBrush()
            {
                ImageSource = new BitmapImage(new Uri("images/head/" + head, UriKind.Relative))
            };
            return headBrush;
        }

f：点击黑色座位事件：blackChair_MouseLeftButtonDown

            //if (!BlackPlayerInChair)
            //{
            //    BlackPlayerInChair = true;
            //    blackChair.Fill = new RadialGradientBrush(Colors.Blue, Colors.White);
            //    Enter(2);
            //}
            if (BlackPlayer == null)
            {
                BlackPlayer = App.player;
                blackChair.Fill = GetPlayerBrush(App.player.Head);
                blackText.Text = App.player.NickName;
                Enter(2);
            }

g：点击红色座位事件:redChair_MouseLeftButtonDown

            //if (!RedPlayerInChair)
            //{
            //    RedPlayerInChair = true;
            //    redChair.Fill = new RadialGradientBrush(Colors.Blue, Colors.White);
            //    Enter(1);
            //}
            if (RedPlayer == null)
            {
                RedPlayer = App.player;
                redChair.Fill = GetPlayerBrush(App.player.Head);
                redText.Text = App.player.NickName;
                Enter(1);
            }

说明

GameRoom类的代码到此就改完了，差不多把整类都重写了，看，成本多高~~~房子啊房子~

2：Silverlight端：Game类调整

代码不多，把原来的函数注释掉，换个新的如下：

CreateGameRoom 创建房间

public void CreateGameRoom(int count)
        {
            GameRoomList = new List<GameRoom>();
            ImageBrush bgBrush = new ImageBrush()
            {
                ImageSource = new BitmapImage(new Uri("images/chess/tablen.png", UriKind.Relative))
            };
            ImageBrush gamingBrush = new ImageBrush()
            {
                ImageSource = new BitmapImage(new Uri("images/chess/tables.png", UriKind.Relative))
            };
            int GameRoomWidth = 150;
            int pageWidth = 800;
            int x = 0, y = 0;
            Point location;
            for (int i = 0; i < count; i++)
            {
                //计算房间位置
                x = (i % (pageWidth / GameRoomWidth)) * GameRoomWidth;//  + margin+ i % (pageWidth / GameRoomWidth) * 20;
                y = (i / (pageWidth / GameRoomWidth)) * GameRoomWidth;// + margin;
                location = new Point(x, y);
                GameRoom GameRoom = new GameRoom(i + 1, location, GameRoomWidth, bgBrush, gamingBrush);
                GameRoomList.Add(GameRoom);
            }
        }

3：Silverlight端：Room.xaml调整

房间更新接收通过时，由于字段变化，需要调整一下：

        void UpdateRoomState(GameService.Room gsRoom, GameRoom room)
        {
            //room.RedPlayerInChair = gsRoom.RedInChair;
            //room.BlackPlayerInChair = gsRoom.BlackInChair;
            room.RedPlayer = gsRoom.RedPlayer;
            room.BlackPlayer = gsRoom.BlackPlayer;
            room.IsGaming = gsRoom.IsGaming;
            room.ReDraw();
        }

还有构造函数原来创建了30个房间，为兼容高度，改成20个房间了。

game.CreateGameRoom(20);

4：Silverlight端：Login.xaml调整

登陆的时候，给用户设置一个默认头像，当然也可以改成选择头像的方式：

btnLogin_Click

private void btnLogin_Click(object sender, RoutedEventArgs e)
        {
            nickName = txtNickName.Text.Trim();
            if (nickName == "")
            {
                MessageBox.Show("请输入昵称!");
                return;
            }
            if (nickName.Contains(","))
            {
                MessageBox.Show("昵称不能包含非法字符!");
                return;
            }
            btnLogin.IsEnabled = false;
              App.player.ID = userID;
            App.player.NickName = nickName;
            App.player.Head = "1.png";//只是加了这一行
            App.client.LoginAsync(App.player);
        }

第九阶段源码：点击下载

结言：

为了装修房间，大动干戈了一场，不过看到最后结果，相信还是值的。

版权声明：程序员胖胖胖虎阿发表于 2022年11月11日下午11:48。
转载请注明：Silverlight+WCF 实战-网络象棋最终篇之房间装修-Silverlight端[带第九阶段源码](三) | 胖虎的工具箱-编程导航