Cocos2dx BASICS (13) -- button control cccontrolbutton

Source: Internet
Author: User


[Introduction]

The button class cccontrolbutton inherits from the control class cccontrol.

The control class cccontrol mainly provides a series of control trigger events for child classes. When a subcontrol triggers related events, it executes the related control Event Callback Function. This is similar to the menu button callback in ccmenu.

The control class cccontrol has three subclasses:

(1) Switch Control cccontrolswitch

(2) The slider control cccontrolslider

(3) button control cccontrolbutton

This section describes one of its child classes: the button class cccontrolbutton.


[References]

Http://gl.paea.cn/contents/22933f46650c8213.html



Cccontrolbutton]

Button ControlCccontrolbuttonI'm sure you are not familiar with this? Buttons are basically used for each game.

650) This. width = 650; "src =" http://s3.51cto.com/wyfs02/M01/47/10/wKiom1P2IBLANK8kAABhfx2d0gI307.jpg "Title =" 1.jpg" alt = "wkiom1p2iblank8kaabhfx2d0gi307.jpg"/>

A button not only has several different button states, but also has some button events. In addition, the background image used by the button control cccontrolbutton is.Ccscale9spriteTo keep the corners and corners unchanged when the buttons become larger.


1. Button status cccontrolstate:

Cccontrolstatenormal // normal cccontrolstatehighlighted // highlight (that is, in the internal touch state) cccontrolstatedisabled // disable cccontrolstateselected // select


2. Button event cccontrolevent:

Cccontroleventtouchdown // cccontroleventtouchdraginside when you start to touch the button // cccontroleventtouchdragoutside when you drag the button internally (holding the touch state) cccontroleventtouchdragoutside when you drag the button externally (holding the touch state) cccontroleventtouchdragenter // when you drag the image to the inner (keep touch) cccontroleventtouchdragexit // when you drag the image to the inner (keep touch) cccontroleventtouchupinside // lift your finger internally (with a hold of touch) cccontroleventtouchupoutside // lift your finger externally (with a hold of touch) cccontroleventtouchcancel // cancel the contact


3. How to bind button events:

// Bind the control Event Events (this, cccontrol_selector (helloworld: touchdownaction), cccontroleventtouchdown); void Merge (ccobject * target, sel_cccontrolhandler action, cccontrolevent controlevents ); // Delete control events // events (this, cccontrol_selector (helloworld: touchdownaction), cccontroleventtouchdown); void events (ccobject * target, sel_cccontrolhandler action, cccontrolevent controlevents );


4. header files and namespaces to be referenced:

# Include "cocos-ext.h" // include cocos-ext.h header file using namespace cocos2d: extension; // reference cocos2d: Extension namespace


5. Common operations are as follows:

Class cccontrolbutton: Public cccontrol {/*** three methods for creating cccontrolbutton * // use the ccscale9sprite shown in Figure 9. The ccscale9sprite button does not contain the label cclabelstatic cccontrolbutton * Create (ccscale9sprite * sprite ); // use the label, which can be cclabelttf, cclabelbmfontstatic cccontrolbutton * Create (ccnode * label, ccscale9sprite * backgroundsprite); // Title: label content // fontname: Font Resource, for example, "Arial" // fontsize: font size. The default value is 12 // The internally created label is cclabelttfstatic cccontrolbutton * Create (STD: String Title, const char * fontname, float fontsize);/*** attribute setting 1 (under the current cccontrolstate) * getcurrenttitle, getcurrenttitlecolor, * titlelabel, backgroundsprite, preferredsize * // The currently displayed TAG content, read-only getcurrenttitlecc_synthesize_readonly (ccstring *, m_currenttitle, currenttitle); // the color of the currently displayed TAG content, read-only cursor (cccolor3b, m_currenttitlecolor, currenttitlecolor); // sets the current cccontrolst Set/configure (ccnode *, m_titlelabel, titlelabel); // set the background sprite under the current cccontrolstate, set/configure (ccscale9sprite *, m_backgroundsprite, backgroundsprite ); // set the button size. If the label size is greater than the button size, it will be automatically expanded. Set/get. // After my test, the button size is fixed. Auto scaling is not performed according to the label size. Cc_property (ccsize, m_preferredsize, preferredsize);/*** Property setting 2 (under the specified cccontrolstate) * reset, settitleforstate, settitlecolorforstate, * settitlettfforstate, success, * success, * fail, * fail, setbackgroundspriteframeforstate, getbackgroundspriteforstate * // set the font label under the specified cccontrolstate // if no label is set, the default font label is ccbuttonstatenormal. // The font label can be cclabelttf, cclabelbmfontvirtual void settitlelabelforstate (ccnode * label, cccontrolstate State); Virtual ccnode * gettitlelabelforstate (cccontrolstate State ); // set the label content under the specified cccontrolstate // if no label is set, the virtual void settitleforstate (ccstring * Title, cccontrolstate State) of the label content in the ccbuttonstatenormal state is returned by default ); virtual ccstring * gettitleforstate (cccontrolstate State); // sets the label color virtual void settitlecolorforstate (cccolor3b color, cccontrolstate state) under the specified cccontrolstate; virtual const cccolor3b gettitlecolorforstate (cccontrolstate state State ); //###################################### ######################################## # // set the label under the specified cccontrolstate to cclabelttf // fntfile as the Font Resource Name, for example, "Arial" virtual void settitlettfforstate (const char * fntfile, cccontrolstate State); Virtual const char * gettitlettfforstate (cccontrolstate State ); // set the font size of the cclabelttf label under the specified cccontrolstate virtual void settitlettfsizeforstate (float size, cccontrolstate State); Virtual float gettitlettfsizeforstate (cccontrolstate State ); //###################################### ######################################## # // set the label under the specified cccontrolstate to cclabelbmfont // fntfile as the Font Resource Name, for example *. fntvirtual void settitlebmfontforstate (const char * fntfile, cccontrolstate State); Virtual const char * gettitlebmfontforstate (cccontrolstate State ); //###################################### ######################################## # // use the node 9 diagram ccscale9sprite, sets the background genie virtual void setbackgroundspriteforstate (ccscale9sprite * Sprite, cccontrolstate state) under the specified cccontrolstate; // uses the sprite frame ccspriteframe, set the background Genie under the specified cccontrolstate // The Code actually implemented internally is actually using the spriteframe to create the point 9 Figure ccscale9sprite as the background genie virtual void setbackgroundspriteframeforstate (ccspriteframe * spriteframe, cccontrolstate State); // obtain the background image virtual ccscale9sprite * getbackgroundspriteforstate (cccontrolstate state) under the specified cccontrolstate;/*** inherits from the parent class */virtual void setenabled (bool enabled ); // whether to enable virtual void setselected (bool enabled); // whether to select virtual void sethighlighted (bool enabled); // whether to highlight };



[Code practice]

The Code comes from cocos2dx's official project testcpp.

(1) button background (normal, highlighted ):

650) This. width = 650; "src =" http://s3.51cto.com/wyfs02/M00/47/10/wKiom1P2JlLjKQQzAAAEV8Vt0Zg458.jpg "Title =" btnnormal.png "style =" text-align: center; float: none; "alt =" wkiom1p2jlljkqqzaaaev8vt0zg458.jpg "/> 650) this. width = 650; "src =" http://s3.51cto.com/wyfs02/M01/47/11/wKioL1P2J2rQSAcyAAAFFwINX1I908.jpg "Title =" btnhighlighted.png "style =" text-align: center; float: none; "alt =" wkiol1p2j2rqsacyaaaffwinx1i908.jpg "/>

So big? 650) This. width = 650; "src =" http://img.baidu.com/hi/tsj/t_0009.gif "style =" text-align: center; "alt =" t_0009.gif "/>

(2) Import files and namespaces:

#include "cocos-ext.h"using namespace cocos2d::extension;//

(3) Declare the callback function of the button event in helloworld. H, and display the label of the button status:

Cclabelttf * displaylabel; // labelvoid touchdownaction (ccobject * sender, cccontrolevent controlevent) for displaying the button status; // void notify (ccobject * sender, cccontrolevent controlevent) when the button is just started ); // void touchdragoutsideaction (ccobject * sender, cccontrolevent controlevent) when dragging internally (holding the touch State); // when dragging externally (holding the touch state) void touchdragenteraction (ccobject * sender, cccontrolevent controlevent); // void touchdragexitaction (ccobject * sender, cccontrolevent controlevent) when you drag to the inside (keep touch ); // when you move the cursor away from the interior (in the touch-preserving State) void touchupinsideaction (ccobject * sender, cccontrolevent controlevent); // lift your finger internally (in the touch-preserving State) void touchupoutsideaction (ccobject * sender, cccontrolevent controlevent); // you can call void touchcancelaction (ccobject * sender, cccontrolevent controlevent) by raising your finger externally (holding your touch //

(4) create a button in the init of helloworld. cpp and bind the button event:

Bool helloworld: Init () {If (! Cclayer: Init () {return false;} // obtain the visible area size. ccsize mysize = ccdirector: shareddire()-> getvisiblesize (); // obtain the origin of the visible area. ccpoint origin = ccdirector: shareddirector ()-> getvisibleorigin (); // the center position of the screen. ccpoint midpos = CCP (mysize. width/2, mysize. height/2); // display the label displaylabeldisplaylabel = cclabelttf: Create ("No event", "marker felt", 32) of the button status ); displaylabel-> setposition (midpos + CCP (0,100); this-> addch ILD (displaylabel); // The background Sprite in the button * bgnormal = ccscale9sprite: Create ("btnnormal.png"); // normal background ccscale9sprite * bghighlighted = ccscale9sprite :: create ("btnhighlighted.png"); // highlight the background. // The label cclabelttfcclabelttf * titlenormal = cclabelttf: Create ("button is normal! "," Marker felt ", 30); maid: Create (" button is highlighted! "," Marker felt ", 30); // create the button cccontrolbuttoncccontrolbutton * BTN = cccontrolbutton: Create (titlenormal, bgnormal); BTN-> setposition (midpos ); this-> addchild (BTN); // set the status BTN when the button is highlighted-> Summary (titlehighlighted, cccontrolstatehighlighted); // highlight the label BTN-> settitlecolorforstate (ccred, cccontrolstatehighlighted ); // red BTN-> setbackgroundspriteforstate (bghighlighted, cccontrolstatehighlighted); // highlight the background // After this sentence is written, the size is fixed. No auto scaling is performed according to the label size. // BTN-> setpreferredsize (ccsizemake (); // The binding event is used to display the button status BTN-> addtargetwithactionforcontrolevents (this, cccontrol_selector (helloworld: touchdownaction), cccontroleventtouchdown); // BTN-> starting (this, cccontrol_selector (helloworld: touchdraginsideaction), callback ); // BTN-> addtargetwithactionforcontrolevents (this, cccontrol_selector (helloworld: touchdragoutsideaction), cccontroleventtouchdragoutside) while dragging internally (holding the touch ); // BTN-> addtargetwithactionforcontrolevents (this, cccontrol_selector (helloworld: touchdragenteraction), cccontroleventtouchdragenter) while dragging externally (keeping touch ); // drag BTN-> addtargetwithactionforcontrolevents (this, cccontrol_selector (helloworld: touchdragexitaction), cccontroleventtouchdragexit) when you enter the inner state (keep touch ); // drag BTN-> addtargetwithactionforcontrolevents (this, cccontrol_selector (helloworld: touchupinsideaction), cccontroleventtouchupinside) when you just exit the interior (with a touch left ); // raise your finger internally (keep your touch) BTN-> addtargetwithactionforcontrolevents (this, cccontrol_selector (helloworld: touchupoutsideaction), cccontroleventtouchupoutside ); // raise your finger externally (keep touch) BTN-> addtargetwithactionforcontrolevents (this, cccontrol_selector (helloworld: touchcancelaction), cccontroleventtouchcancel); // cancel the contact return true ;}//

(5) callback function for implementing button events:

// Void helloworld: touchdownaction (ccobject * senderz, cccontrolevent controlevent) {displaylabel-> setstring ("Touch down ");} // void helloworld: touchdraginsideaction (ccobject * sender, cccontrolevent controlevent) {displaylabel-> setstring ("drag inside ");} // void helloworld: touchdragoutsideaction (ccobject * sender, cccontrolevent controlevent) {displaylabel-> setstring ("drag outside ");} // void helloworld: touchdragenteraction (ccobject * sender, cccontrolevent controlevent) {displaylabel-> setstring ("drag enter ");} // when you move the widget away from the canvas (in the touch-preserving State) void helloworld: touchdragexitaction (ccobject * sender, cccontrolevent controlevent) {displaylabel-> setstring ("dralevg exit ");} // raise your finger internally (with a hold of touch) void helloworld: touchupinsideaction (ccobject * sender, cccontrolevent controlevent) {displaylabel-> setstring ("touch up inside. ");} // you can call void helloworld: touchupoutsideaction (ccobject * sender, cccontrolevent controlevent) {displaylabel-> setstring (" touch up outside. ") ;}// cancel all touch void helloworld: touchcancelaction (ccobject * sender, cccontrolevent controlevent) {displaylabel-> setstring (" Touch cancel ");}//


Running result:

650) This. width = 650; "src =" http://s3.51cto.com/wyfs02/M00/47/12/wKioL1P2M7nypRzJABsPKqwUVDg336.gif "Title =" 3.gif" alt = "wkiol1p2m7nyprzjabspkqwuvdg336.gif"/>


Analyze the running result:

(1) originally a button image so small, so it changes so big 650) This. width = 650; "src =" http://img.baidu.com/hi/face/ I _f15.gif "alt =" I _f15.gif "/>? This is because when the label cclabelttf is larger than the button size, the button will automatically stretch.

(2) I have set the label titlehighlighted IN THE highlighted state, and the label content should display "button is highlighted! "That's right. Why is" button is normal "? 650) This. width = 650; "src =" http://img.baidu.com/hi/face/ I _f06.gif "alt =" I _f06.gif "/>... Okay, I don't know about this. However, the font color and the background sprite of the button are indeed replaced.

(3) button events:

Cccontroleventtouchdragenter // when the drag is just inside (keep the touch state)

Cccontroleventtouchdragexit // when you drag the widget to the canvas, keep it in touch)

Do you know what we have observed? This is because you can see the effect only when the button is in or out, and your hands become draginside or dragoutside when you shake it. 650) This. width = 650; "src =" http://img.baidu.com/hi/face/ I _f07.gif "alt =" I _f07.gif "/>



[Demo download]






This article is from the "summer wind" blog, please be sure to keep this source http://shahdza.blog.51cto.com/2410787/1543349

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.