CASlider(滑动条)

2018-09-08 15:37 更新

类说明

CASlider是滚动条控件,主要作用是方便数值调节,如音量大小控制、缩放视图等操作。


CASlider 属性(点击查看方法介绍)

属性说明
TouchClick触摸点击
Value
MinValue最小值
MaxValue最大值
TrackHeight滚动条高度
MinTrackTintImage设置前景图片(已经划过的部分) 
MaxTrackTintImage设置后景图片(未划过的部分) 
ThumbTintImage滚动块的图片


CASlider 方法(点击查看方法介绍)

方法说明
createWithFrame创建,并指定其Frame,默认Frame为(0,0,0,0)
createWithCenter创建,并指定其Center,默认Center为(0,0,0,0)
addTarget添加回调事件
addTargetForTouchUpSide添加回调事件的触摸
removeTarget删除回调事件
setValue设定值
setMinValue设定最小值
setMaxValue设定最大值
setTrackHeight设置滚动条高度
setMinTrackTintImage设置前景图片(已经划过的部分) 
setMaxTrackTintImage设置后景图片(未划过的部分) 
setThumbTintImage设置滚动块的图片
initWithFrame初始化r,并指定其Frame
initWithCenter初始化,并指定其Center
ccTouchBegan触摸事件开始时的回调函数
ccTouchMoved触摸事件中触点移动时的回调函数
ccTouchEnded触摸事件结束时的回调函数
layoutSubViews子视图布局


我们可以通过设置CASlider的最大值和最小值来确定其值的范围,可以通过设置图片改变滚动条的样子,我们这里就利用CASlider来控制一张图片的缩放大小,来演示一下CASlider的使用方法:
首先我们在FirstViewController.h中添加一个监听函数,用于监听CASlider的值的变化。

//监听函数
    void zoomViewBySliderValue(CAControl* control, DPoint point)

然后我们在FirstViewController.cpp中去实现CASlider来控制CAImageView的缩放变化。


void FirstViewController::viewDidLoad()
{
    //获得屏幕大小
    CCSize size = this->getView()->getBounds().size;
     
    //创建CAImageView
    CAImageView* imageView = CAImageView::createWithImage(CAImage::create("HelloWorld.png"));
    imageView->setCenter(DRect(size.width*0.5, size.height*0.5, 800, 1200));
     
    //设置tag
    imageView->setTag(1);
    
    //添加
    this->getView()->addSubview(imageView);
     
    //创建CASlider
    CASlider* slider = CASlider::createWithCenter(DRect(size.width*0.5, size.height*0.2, size.width*0.8, 20));
     
    //绑定监听
    slider->addTarget(this, CAControl_selector(FirstViewController::zoomViewBySliderValue));
    
    //添加
    this->getView()->insertSubview(slider, 1);
     
    //创建CALabel
    CALabel* label = CALabel::createWithCenter(DRect(size.width*0.5, size.height*0.1, size.width*0.8, 40));
    
    //设置文本
    char temptext[40];
    sprintf(temptext, "ScaleValue:%0.2f", slider->getValue());
    label->setText(temptext);
     
    //设置居中
    label->setTextAlignment(CATextAlignmentCenter);
    label->setVerticalTextAlignmet(CAVerticalTextAlignmentCenter);
    
    //设置Tag
    label->setTag(3);
    this->getView()->addSubview(label);
}
 
void FirstViewController::zoomViewBySliderValue(CAControl* control, DPoint point)
{
    //获得silder对象
    CASlider* slider = (CASlider*)control;
     
    //获得silder的当前值
    float zoomValue = slider->getValue();
     
    //根据tag值获得image
    CAImageView* image = (CAImageView*)this->getView()->getSubviewByTag(1);
     
    //设置image的缩放比
    image->setScale(zoomValue);
     
    //根据tag获得CALabel
    CALabel* label = (CALabel*)this->getView()->getSubviewByTag(3);
     
    //设置文本
    char temptext[40];
    sprintf(temptext, "ScaleValue:%0.2f", slider->getValue());
    label->setText(temptext);
}

我们通过addTarget来为CASlider绑定一个监听,我们又在监听函数中,根据CASlider的变化来改变CAImageView的缩放值,同样的原理我们也可以进行其它数值的改变,大家举一反三可以自己去尝试一下。


CASlider 属性说明

TouchClick

类型:bool

解释:触摸点击。is{}。

    

Value     

类型:float

解释:值。get{}。


MinValue 

类型:float

解释:最小值。get{}。


MaxValue  

类型:float

解释:最大值。get{}。


TrackHeight 

类型:float

解释:滚动条高度。get{}。


MinTrackTintImage

类型:CAImage*

解释:设置前景图片(已经划过的部分) 。get{}。


MaxTrackTintImage

类型:CAImage*

解释:设置后景图片(未划过的部分) 。get{}。


ThumbTintImage

类型:CAImage*

解释:滚动块的图片 。get{}。


CASlider 方法说明

static CASlider* createWithFrame(const DRect& rect);

返回值:static CASlider

参数:

类型
参数名说明
DRectrect区域大小

解释:创建,并指定其Frame,默认Frame为(0,0,0,0)


static CASlider* createWithCenter(const DRect& rect);

返回值:static CASlider

参数:

类型
参数名说明
DRectrect中心点的位置及大小

解释:创建,并指定其Center,默认Center为(0,0,0,0)


void addTarget(CAObject* target, SEL_CAControl selector);

返回值:void

参数:

类型
参数名说明
CAObject*target目标
SEL_CAControlselector选择器

解释:添加回调事件


void addTargetForTouchUpSide(CAObject* target, SEL_CAControl selector);

返回值:void

参数:

类型
参数名说明
CAObject*target目标
SEL_CAControlselector选择器

解释:添加回调事件的触摸


void removeTarget(CAObject* target, SEL_CAControl selector);

返回值:void

参数:

类型
参数名说明
CAObject*target目标
SEL_CAControlselector选择器

解释:删除回调事件


virtual void setValue(float value);

返回值:virtual void

参数:

类型
参数名说明
floatvalue

解释:设定值


virtual void setMinValue(float minValue);

返回值:virtual void

参数:

类型
参数名说明
floatminValue最小值

解释:设定最小值


virtual void setMaxValue(float maxValue);

返回值:virtual void

参数:

类型
参数名说明
floatmaxValue最大值

解释:设定最大值


virtual void setTrackHeight(float trackHeight);

返回值:virtual void

参数:

类型
参数名说明
floattrackHeight滚动条高度

解释:设置滚动条高度


virtual void setMinTrackTintImage(CAImage* minTrackTintImage);

返回值:virtual void

参数:

类型
参数名说明
CAImage*minTrackTintImage前景图片(已经划过的部分)  

解释:设置前景图片(已经划过的部分)  


virtual void setMaxTrackTintImage(CAImage* maxTrackTintImage);

返回值:virtual void

参数:

类型
参数名说明
CAImage*maxTrackTintImage后景图片(未划过的部分) 

解释:设置后景图片(未划过的部分) 


virtual void setThumbTintImage(CAImage* thumbTintImage);

返回值:virtual void

参数:

类型
参数名说明
CAImage*thumbTintImage滚动块的图片 

解释:设置滚动块的图片 

      

void setContentSize(const CCSize & var);

返回值:void

参数:

类型
参数名说明
CCSizevar内容大小

解释:设置内容大小


bool initWithFrame(const DRect& rect);

返回值:bool

参数:

类型参数名说明
const DRect&rect区域大小

解释:初始化,并指定其Frame


bool initWithCenter(const DRect& rect);

返回值:bool

参数:

类型参数名说明
const DRect&rect中心点的位置及大小

解释:初始化,并指定其Center


virtual bool ccTouchBegan(CATouch *pTouch, CAEvent *pEvent);

返回值:virtual bool

参数:

类型参数名说明
CATouch*pTouch触摸传递对象
CAEvent*pEvent此参数待定

解释:触摸事件开始时的回调函数


virtual void ccTouchMoved(CATouch *pTouch, CAEvent *pEvent);

返回值:virtual void

参数:

类型参数名说明
CATouch*pTouch触摸传递对象
CAEvent*pEvent此参数待定

解释:触摸事件中触点移动时的回调函数


virtual void ccTouchEnded(CATouch *pTouch, CAEvent *pEvent);

返回值:virtual void

参数:

类型参数名说明
CATouch*pTouch触摸传递对象
CAEvent*pEvent此参数待定

解释:触摸事件结束时的回调函数


virtual void layoutSubViews();

返回值:virtual void

参数:

解释:子视图布局



以上内容是否对您有帮助:
在线笔记
App下载
App下载

扫描二维码

下载编程狮App

公众号
微信公众号

编程狮公众号