Flex online game development-wuziqi game: (2) user-friendly Selection

Through the previous exercise: Flex online game development-wuziqi game: (1) Core of the game we have made core functions of wuziqi. Now, we are doing something that is not logically important but crucial to software development and user experience. Flex is a kind of sublimation of flash and a language for programmers. It provides a good user experience. I will go further here, this game makes users feel more immersive. I will focus on the following topics based on the actual situation of the game.

There are various explanations for user experience, but I often see someProgramDue to their lack of beautification capabilities, some programs cannot be beautified. They are really inferior to the items provided by direct APIs, and there are many failed classes, this is also the reason why programmers need to communicate and cooperate with the artist.

1) give users a sense of accomplishment

Now, I try to add some basic user information functions to the program, and add the points function, so that the user can get some virtual rewards after the next disk. It looks like this at last

In a long and boring programming career, my team and I often come up with a variety of ways to be happy. For example, in the testing stage, the users of my software are basically the beauty team, from the early Wang zuxian, Zhou Huimin to Xiao and Zhang baizhi, Lin Zhiling is the main one. Working with both men and women is not tiring. Really, testing is much easier. Try it.

Well, design a class. Uservo.

 [Bindable]  Public   class  uservo {< SPAN class = "kwrd"> Public  var win:  int ;  Public  var lost:  int ;  Public  var score:  int ;  Public  var points:  int ;  Public  var uid:  int  =-1;  Public  var picture: string;  Public  var name: String ;}

This class is designed to bind, because we don't have to bother with the displayed content when we play the game. Add two users

  private  function createuser ():  void  {userarray =  New  arraycollection (); var User: uservo =  New  uservo (); User. name =  "" ; user. picture =  "assets/icons/zbz.jpg" ; user. score = 0; user. win = 0; user. lost = 0; user. points = 250; userarray. additem (User); var user2: uservo =  New  uservo (); user2.name =  "Gillian" ; user2.picture =  "assets/icons/aj.jpg" ; user2.score = 0; user2.win = 0; user2.lost = 0; user2.points = 290; userarray. additem (user2) ;}

Bind the class to list for display

 <  MX: List   Bordervisible  = "False"   Width  = "100%"  Height  = "100%"   Dataprovider  = "{Userarray }"  >       <  MX: itemrenderer  >        <  FX: Component  >         <  MX: vbox   Width  = "100%"   Height  = "100%"  >          <  MX: Image   Source = "{Data. Image }"   Width  = "90"   Height  = "90"  />          <  S: hgroup   Width  = "100%"  >           <  S: Label   Text  = "Name :"   />           <  S: Label   Text  = "{Data. name }"   Width = "100%"   />          </  S: hgroup  >          <  S: hgroup   Width  = "100%"  >           <  S: Label   Text  = "Gold coins :"   />           <  S: Label   Text  = "￥ {Data. Points }"   Width  = "100%"  />          </  S: hgroup  >          <  S: hgroup   Width  = "100%"  >           <  S: Label   Text  = "Points: {data. Score"   />          </  S: hgroup  >          <  S: hgroup   Width  = "100%" >           <  S: Label   Text  = "Win: {data. Win} negative: {data. Lost }"   />          </  S: hgroup  >         </  MX: vbox  >        </  FX: Component  >       </  MX: itemrenderer  >      </  MX: List  > 

Join and begin to surrender this conventional logic processing. Enable the game to complete one drive and one drive :), so far as you die.

    S: button   id   = "btnstart"   label   =" "  enabled   = "true"   click   = "button#clickhandler (Event) " />     s: button   id   = "btnlose"   label   =" surrender "  enabled   = "false"   click   = "button2_clickhandler (Event) " />  

2) Add a timer to allow better cooperation between users

The timer is transferred between players. When a player finishes playing chess, it is handed over to another player. If the player does not finish playing chess within the specified time, it is deemed as automatically giving up the next child, the system will give control of the current game to the other party

The default value is 1 minute 30 seconds.

 // Time limit Timer              Private VaR Timer: timer;Private VaR h_num: Int = 0; Private VaR m_num: Int = 1; Private VaR s_num: Int = 30; // Timer function  Private Function ontimer ( Event : Timerevent ): Void {S_num = s_num-1; If (S_num =-1) & (m_num> 0) {m_num = m_num-1; s_num = 59 ;}If (M_num = 0) & (h_num> 0) {h_num = h_num-1; m_num = 59; s_num = 59 ;} If (S_num <0) {s_num = 0; timer. Stop (); alert. Show ( "Timing complete! " , "Information" );} Var hh: string; var mm: string; var SS: string; HH = (h_num <10 )? "0" + H_num.tostring (): h_num.tostring (); Mm = (m_num <10 )? "0" + M_num.tostring (): m_num.tostring (); SS = (s_num <10 )? "0" + S_num.tostring (): s_num.tostring (); outtime. Text = HH + ":" + Mm + ":" + SS ;}

Call after the user clicks and starts the game

 
If(Timer. Running) {timer. Stop () ;}resettimer (); timer. Start ();
 

Now, when you play chess, the interface is like this.

3) make the user interface more realistic

At the moment, I am not planning to replace the topic of this project to make the main interface more beautiful, because in my imagination, the post-production of this game is still a long way to go, you will see how to create a beautiful theme in later chapters. Now I just want to make the chess board and chess pieces more beautiful. More realistic. Let's look at the board first. I think there seems to be more room for imagination to use a wood grain on the background. Find a wood grain on Google first.

// Board background[Embed ("Assets/icons/mw1.gif")]Protected ConstBoardchess: class;PrivateVaR board_img: bitmapfill =NewBitmapfill ();
 

// Add to the program initialization event

Board_img.source = boardchess; board_img.fillmode = bitmapfillmode. Repeat; Board. backgroundfill = board_img;
 

Similarly, we can also make the pawns more beautiful, but we can fill them with color when the user clicks the week and change them to graph-based filling.

  If  (turn = player_one_turn) {clickqizhi. turn = player_one_turn;  // clickellipse. fill = black_color;  clickellipse. fill = black_img;}  else  {clickqizhi. turn = player_two_turn;  // clickellipse. fill = white_color;  clickellipse. fill = white_img;} 

Now, a single-host five-game that can be used to play chess has been completed. Next I will introduce how to turn this single-host game into an online game.

To show you more rewards, you can click here to play the game,