美文网首页
08-按钮状态的研究

08-按钮状态的研究

作者: 小胖子2号 | 来源:发表于2016-11-26 15:37 被阅读54次

效果图:

AB20E935-2637-4B63-A540-A0721969E1D2.png

一、分析:

先做中间的Label,设置约束:垂直、水平居中即可

二、拓展 : Label(文字):如何在storyboard / Xib中显示多行文字?

两种方法:
第一种:在xib中设置
(1.)Lines 设为0
(2.)每到要换行时,就按option + enter快捷键
(3.)设置文字居中并更新一下

第二种:用代码

** 三、注意:**

  • 按钮若不设置宽高,会根据图片(backImage)自动调整大小

  • 按钮样式system/ custom会影响按钮点击后的显示

  • Xib添加完控件,建议在左边写好名字:区分控件

  • Xib/storyboard不允许控件里放控件,一般在View或者Scrollview里可以放控件

四、按钮状态研究

(1)按钮一般有四种状态:

  • UIControlStateNormal

    • 1> 除开UIControlStateHighlighted、UIControlStateDisabled、UIControlStateSelected以外的其他情况,都是normal状态
    • 2> 这种状态下的按钮【可以】接收点击事件
  • UIControlStateHighlighted

    • 1>【当按住按钮不松开】或者【highlighted = YES】时就能达到这种状态
  • 2> 这种状态下的按钮【可以】接收点击事件

  • UIControlStateDisabled

    • 1>【button.enabled = NO】时就能达到这种状态
    • 2> 按钮无法点击,这种状态下的按钮【无法】接收点击事件,
  • UIControlStateSelected

    • 1>【button.selected = YES】时就能达到这种状态
    • 2> 按钮可以点击,这种状态下的按钮【可以】接收点击事件

(2)让按钮无法点击的2种方法

1>button.enabled = NO;
【会】进入UIControlStateDisabled状态
2>button.userInteractionEnabled = NO;
【不会】进入UIControlStateDisabled状态,继续保持当前状态

(3)控制disabled和selected状态会出现的问题

控制Disabled状态--->问题:再次点击无反应
控制selected状态--->问题:会出现闪的情况,推荐使用,可以监听点击,作刷新

(4)应用场景一:切换按钮文字 如:百思不得姐的【注册账号】与【已有账号】之间的切换

其实是在NormalSelected之间来回切换
sender.selected = !sender.selected;

(5)应用场景二:如百思不得姐点击当前按钮变红色,上一个按钮变回黑色

效果图:

1.png

正常步骤:
1、搞一属性记录----当前被选中的按钮

2、三步曲:
(1)上一次按钮变灰
(2)当前按钮变红,
(3) 当前按钮变成上一次按钮

缺点:
(1)的颜色要与之前按钮设置的颜色一致,如果之前的按钮颜色改变,三步曲中的按钮颜色也要改变------>不推荐使用

推荐使用 :利用按钮状态来控制按钮颜色的改变

实现代码

/** 当前被选中的按钮 */
@property (nonatomic, weak) XMGTitleButton *selectedTitleButton;

#pragma mark - 监听
- (void)titleClick:(XMGTitleButton *)titleButton
{
    // 控制按钮状态
    self.selectedTitleButton.selected = NO; 
    titleButton.selected = YES;                       
    self.selectedTitleButton = titleButton;
}

相关文章

  • 08-按钮状态的研究

    效果图: 一、分析: 先做中间的Label,设置约束:垂直、水平居中即可 二、拓展 : Label(文字):如何在...

  • 自定义Vue2.0组件

    Button 按钮 常用的操作按钮。 基础用法 基础的按钮用法。 禁用状态 按钮禁用状态 带图标的按钮 让按钮不仅...

  • Button enabled和userInteractionEn

    userInteractionEnabled不改变按钮状态,仅仅使得按钮不能被点击enabled更改会改变按钮状态...

  • iOS开发之多个按钮选中的问题

    问题介绍: 想要实现的功能有:有多个按钮按钮被点击后为选中状态有按钮被选中时点击其他按钮,之前被选中的按钮状态变为...

  • tag的使用

    按钮设置标题! 因为 按钮有多种状态,比如选中、正常转态,所以,要明确告诉按钮,你的按钮是神马状态,它才能执行! ...

  • 平面设计课堂:按钮如何设计更能吸引人

    按钮的不同分类如下: * 动作按钮 * 常用按钮样式 * 按钮的颜色和形状 * 按钮状态和反馈 * 标签按钮 * ...

  • 2021-03-30 vue(uni-app)动态切换按钮效果

    场景:多个按钮,只有一个按钮为已点击状态。被点击的按钮class设置为激活状态。 思路:1、按钮calss设置为根...

  • 按钮状态的变化

    产品设计经常遇到这种问题 举例,一个按钮点击关注,再次点击取消关注 那么按钮被点击后样式是什么呢?是关注中(用户可...

  • 按钮的isSelected状态

    要实现按钮的选中和未选中两种效果 设想 按钮 首先是未选中状态,是灰色的 也可以想象成按钮是关闭状态的然后点击 成...

  • 公用ui组建封装

    单选按钮组单选按钮组 状态标签状态标签 时间轴时间轴

网友评论

      本文标题:08-按钮状态的研究

      本文链接:https://www.haomeiwen.com/subject/gweypttx.html