创新互联鸿蒙OS教程:鸿蒙OSButton

鸿蒙OS Button

按钮(Button)是一种常见的组件,点击可以触发对应的操作,通常由文本或图标组成,也可以由图标和文本共同组成。

图1 文本按钮

图2 图标按钮

图3 图标和文本共同组成的按钮

创建Button

使用 Button 组件,可以生成形状、颜色丰富的按钮。

button_element.xml:



    
    

响应点击事件

按钮的重要作用是当用户单击按钮时,会执行相应的操作或者界面出现相应的变化。实际上用户点击按钮时,Button 对象将收到一个点击事件。 开发者可以自定义响应点击事件的方法。例如,通过创建一个 Component.ClickedListener 对象,然后通过调用 setClickedListener 将其分配给按钮。

//从定义的xml中获取Button对象
Button button = (Button) rootLayout.findComponentById(ResourceTable.Id_button_sample); 
// 为按钮设置点击事件回调
button.setClickedListener(new Component.ClickedListener() {
    public void onClick(Component v) {
        // 此处添加点击按钮后的事件处理逻辑
    }
}); 

不同类型的按钮

按照按钮的形状,按钮可以分为:普通按钮,椭圆按钮,胶囊按钮,圆形按钮等。

  • 普通按钮

普通按钮和其他按钮的区别在于不需要设置任何形状,只设置文本和背景颜色即可,例如:

  

color_blue_element.xml:

  
  
    
  

  • 椭圆按钮

椭圆按钮是通过设置 background_element 的来实现的,background_element 的shape 设置为椭圆(oval),例如:

  

oval_button_element.xml:

  
  
    
  

  • 胶囊按钮

胶囊按钮是一种常见的按钮,设置按钮背景时将背景设置为矩形形状,并且设置 ShapeElement 的 radius 的半径,例如:

  

capsule_button_element.xml:

  
  
    
    
  

  • 圆形按钮

圆形按钮和椭圆按钮的区别在于组件本身的宽度和高度需要相同,例如:

  

circle_button_element.xml:

  
  
    
  

场景示例

利用圆形按钮,胶囊按钮,文本组件可以绘制出如下拨号盘的UI界面。

图4 界面效果

源码示例:



    
    
        

color_light_gray_element.xml:



    

green_text_element.xml:



    
    
    

green_circle_button_element.xml:



    
    

green_capsule_button_element.xml:



    
    

网页题目:创新互联鸿蒙OS教程:鸿蒙OSButton
当前链接:http://www.shufengxianlan.com/qtweb/news48/457948.html

网站建设、网络推广公司-创新互联,是专注品牌与效果的网站制作,网络营销seo公司;服务项目有等

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联