SAPUI5-Button

原创 2015年07月09日 11:07:47

Button
存在两个类,一个是mobile使用的sap.m.Button,另外一个是sap.ui.commons.Button

sap.ui.commons.Button
这里写图片描述

var oButton1 = new sap.m.Button("But1",{
            text : "Button",
            width : "200px",
            icon : "sap-icon://email",
            activeIcon : "sap-icon://accept",
            type : "Accept",
            enabled : true,
            iconFirst : true,
            tooltip : "This is a test tooltip",
            textDirection : "RTL",
            styled: false,
            press : function() {
                 this.setIcon("sap-icon://accept");
            }
        });     

其中:
type表示按钮的类型,对应sap.m.ButtonType,有Accept 、Back、Default 、Emphasized 、Reject 、Transparent、Unstyled、Up

enabled表示是否可以选择,布尔类型

iconFirst表示图标在前还是文字在前,布尔类型

sap.ui.commons.Button

createContent : function(oController) {
        var oButton1 = new sap.ui.commons.Button("But1",{
            text : "Button",
            width : "200px",
            height : "30px",
            helpId : "help",
            icon : "sap-icon://email",
            iconHovered : "sap-icon://accept",
            iconSelected : "sap-icon://accept",
            iconFirst : true,
            tooltip : "This is a test tooltip",
            styled: false,
            press : function() {
//               this.setIcon("sap-icon://accept");
            }
        });     
        oButton1.addStyleClass("myButton");

其中,需要注意的是,可以自己修改样式,styled要设置为false
新建css文件

.myButton {
    background-color: #e3fa2e;
}

HTML中添加

<link rel="stylesheet" href="css/style.css">

修改前
修改后

相关文章推荐

SAPUI5 (03) - 简单控件的使用

SAPUI5 控件的基本使用方法,以及控件的两种基本关系 agrregation 和association。

SAPUI5:图标icon

new sap.ui.commons.Button( { ...

SAPUI5(SAP Fiori)运行环境介绍

  • 2017年06月23日 11:57
  • 4.9MB
  • 下载

SAPUI5是什么?Fiori告诉我们将来UI开发用哪种技术?

最近在奥兰多举行的SAP用户大会上,SAP发布了一套外观令人印象深刻的应用 'Fiori',基于SAP新的HTML5框架(即SAPUI5)。SAPUI5(基于HTML/CSS/Javascript...

SAPUI5 (32) - SAP Web IDE

转载自:http://blog.csdn.net/stone0823/article/details/70339694 SAP Web IDE 是基于 Eclipse 内核的在线开发 IDE,...

SAPUI5教程——ActionSheet的应用

前言ActionSheet是一个点击弹出popover的基本效果,可以让用户执行一定操作事件,如下图:定义controllersap.ui.define(['sap/ui/core/Fragment'...

Web编程学习七:使用JPA + RESTful Web Service + SAPUI5来创建Web应用

在之前的例子学习了如何使用JPA,如何通过Apache olingo来将JPA数据库自动转化为RESTful Web Service。 学习了如何使用SAPUI5,现在我来把它们整合起来。 开发环...

SAPUI5教程——更改ODataModel默认的请求方式

前言对于ODataModel $batch的请求而言,会自动调用ODataModel UPdate的方法的 merge 请求,这也是默认的请求方式,但是我们的项目当中,往往需要put的请求,那么该如何...

PhoneGap+SAPUI5搭建本地应用(Android平台)

一直想尝试一下使用PhoneGap来搭建本地程序,正好之前开发的smart app是基于SAPUI5的,SAPUI5提供了独立的js包,可以导入到PhongGap工程中,这样就可以使用UI5的各种控件...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:SAPUI5-Button
举报原因:
原因补充:

(最多只允许输入30个字)