導航:首頁 > 軟體資訊 > uniapp如何改變按鈕的背景色

uniapp如何改變按鈕的背景色

發布時間:2022-06-28 20:08:43

① ios開發怎麼設置button的背景色

1.通過按鈕的事件來設置背景色
- (void)viewDidLoad {
[super viewDidLoad];

UIButton *button1 = [[UIButton alloc] initWithFrame:CGRectMake(50, 200, 100, 50)];
[button1 setTitle:@"button1" forState:UIControlStateNormal];
button1.backgroundColor = [UIColor orangeColor];
[button1 addTarget:self action:@selector(button1BackGroundHighlighted:) forControlEvents:UIControlEventTouchDown];
[button1 addTarget:self action:@selector(button1BackGroundNormal:) forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:button1];
}

// button1普通狀態下的背景色
- (void)button1BackGroundNormal:(UIButton *)sender
{
sender.backgroundColor = [UIColor orangeColor];
}

// button1高亮狀態下的背景色
- (void)button1BackGroundHighlighted:(UIButton *)sender
{
sender.backgroundColor = [UIColor greenColor];
}

② 怎樣改變BUTTON控制項的背景色和字體色

新建一個對話框工程,在對話框中添加一個按鈕,然後,從button類繼承一個子類 CNewButton, 重載 PreSubclassWindow,修改按鈕的屬性 ModifyStyle( 0 , BS_OWNERDRAW ); ,告訴系統,用戶手繪按鈕; 然後再重載DrawItem,在這里邊修改按鈕的背景色,字體的顏色,修改lpDrawItemStruct參數的值,使用SetBkColor,設置按鈕字體的顏色, SetTextColor設置字體的顏色, 使用FillRect可以填充按鈕的背景色。設置完後,給對話框的按鈕添加一個變數,基類就選擇剛才創建的CNewButton

③ html 如何給button設置背景圖片的同時設置按鈕的背景色

這個可以用css來實現:background:url('imgurl')裡面放圖片地址,如果還想同時顯示背景,需要用透明的PNG圖片,如果不想圖片重復顯示需要設置背景不重復:background-repeat:no-repeat; 然後用background-color:red;設置按鈕的背景顏色。下面例子是簡寫

<inputtype="button"style="background:url(./aa.png)no-repeatcenterred;width:200px;height:200px;">

④ uni-app radio的樣式如何修改

前端中的input類標簽中的radio和checkbox前面的選框的樣式是不能改變的,但是這往往會造成我們在用起來時候樣式的局限性,以下是改變樣式的方法:隱藏默認樣式,並將自己喜歡的樣式作為背景圖片顯示;
首先:將默認樣式隱藏,代碼為
input[type = "radio"] {
display: none;
}

⑤ 安卓界面布局如何改變所有button的背景顏色

可以使用selector來實現Button的特效

main.xml

Xml代碼
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="按下或者獲得焦點Button會變不同顏色"
<SPAN style="COLOR: #ff0000">android:textColor="@color/button_text" </SPAN>/>
</LinearLayout>
www.2cto.com
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="按下或者獲得焦點Button會變不同顏色"
android:textColor="@color/button_text" />
</LinearLayout>

XML 文件保存在res/color/button_text.xml

Xml代碼
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:state_pressed="true" android:color="#ffff0000"/> <!-- pressed -->
<item android:state_focused="true" android:color="#ff0000ff"/> <!-- focused -->
<item android:color="#ff000000"/> <!-- default -->
</selector>

背景選擇器-selector

概述
在drawable/xxx.xml中配置,通過配置selector,可以使系統運行時根據控制項對象的狀態使用相應的圖片、文字等。
selector中的常用屬性
android:state_selected 控制項選中狀態,可以為true或false
android:state_focused 控制項獲得焦點狀態,可以為true或false
android:state_pressed 控制項點擊狀態,可以為true或false
android:state_enabled 控制項使能狀態,可以為true或false
android:state_checkable 控制項可勾選狀態,可以為true或false
android:state_checked 控制項勾選狀態,可以為true或false
注意:在狀態描述中,第一個匹配當前狀態的item會被使用。因此,如果第一個item沒有任何狀態特性的話,那麼它將每次都被使用,所以默認的值必須總是在最後。
android:window_focused 應用程序窗口焦點狀態,可以為true或false
android:color 定義特定狀態的顏色
#rgb
#argb
#rrggbb
#aarrggbb
為16進制顏色。這個顏色由rgb值指定,可帶alpha,必須以」#「開頭,後面跟隨alpha-red-green-blue信息,格式可以為:
使用selector設置背景
把下面的XML保存成.xml文件(比如list_item_bg.xml),運行時系統會根據ListView中列表項的狀態來使用相應的背景圖片。
drawable/list_item_bg.xml
<?xml version="1.0" encoding="utf-8" ?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 默認時的背景圖片 -->
<item android:drawable="@drawable/pic1" />

<!-- 沒有焦點時的背景圖片 -->
<item android:state_window_focused="false"
android:drawable="@drawable/pic1" />

<!-- 非觸摸模式下獲得焦點並單擊時的背景圖片 -->
<item android:state_focused="true" android:state_pressed="true"
android:drawable= "@drawable/pic2" />

<!-- 觸摸模式下單擊時的背景圖片 -->
<item android:state_focused="false" android:state_pressed="true"
android:drawable="@drawable/pic3" />

<!--選中時的圖片背景 -->
<item android:state_selected="true"
android:drawable="@drawable/pic4" />

<!--獲得焦點時的圖片背景 -->
<item android:state_focused="true"
android:drawable="@drawable/pic5" />
</selector>

使用方法
第一種是在listview中配置android:listSelector=」@drawable/list_item_bg」
第二種是在listview的item中添加屬性android:background=」@drawable/list_item_bg」
第三種是java代碼中使用:
Drawable drawable = getResources().getDrawable(R.drawable.list_item_bg);
listview.setSelector(drawable);

註:列表有時候為黑的情況,需要加上下面的代碼使其透明:
android:cacheColorHint="@android:color/transparent"

使用selector設置字體顏色
drawable/button_font.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:color="#FF0000" />
<item android:state_focused="true" android:color="#00FF00" />
<item android:state_pressed="true" android:color="#0000FF" />
<item android:color="#000000" />
</selector>

使用方法
android:textColor="@drawable/button_color"

更復雜的效果
還可以實現更復雜的效果,例如漸變等等。 drawable/button_color.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">
<!-- 定義當button 處於pressed 狀態時的形態。-->
<shape>
<gradient android:startColor="#8600ff" />
<stroke android:width="2dp"
android:color="#000000" />
<corners android:radius="5dp" />
<padding android:left="10dp"
android:top="10dp"
android:bottom="10dp"
android:right="10dp"/>
</shape>
</item>
<item android:state_focused="true">
<!-- 定義當button獲得 focus時的形態 -->
<shape>
<gradient android:startColor="#eac100"/>
<stroke android:width="2dp"
android:color="#333333"
color="#ffffff"/>
<corners android:radius="8dp" />
<padding android:left="10dp"
android:top="10dp"
android:bottom="10dp"
android:right="10dp"/>
</shape>
</item>
</selector>

使用方法
android:background="@drawable/button_color"
android:focusable="true"

⑥ 怎麼去掉uniapp登錄上面的默認樣式

首先我們打開Hbuilder,新建一個項目,如下圖所示
uniapp按鈕樣式怎麼改
2

然後項目類型選擇uni-app,項目名稱隨便起一個即可,如下圖所示
uniapp按鈕樣式怎麼改
3

接著我們就可以直接在vue文件中添加button了,通過type來聲明按鈕的樣式,目前有的是primary,warn,default,如下圖所示
uniapp按鈕樣式怎麼改
4

運行以後我們可以看到三種不同的type對應了三種不同的顏色樣式,如下圖所示
uniapp按鈕樣式怎麼改
5

另外還可以通過loding和disabled來定義按鈕載入中和禁用的樣式,如下圖所示
uniapp按鈕樣式怎麼改
6

在右側我們可以看到用loading的按鈕裡面多了個載入動畫,而用disabled的按鈕是一種不能點擊的狀態
uniapp按鈕樣式怎麼改
7

接著還可以通過plain來取消按鈕的背景顏色,讓它只有邊框,如下圖所示
uniapp按鈕樣式怎麼改
8

運行以後我們就可以看到按鈕只有邊框了,背景變成白色的了,如下圖所示
uniapp按鈕樣式怎麼改
9

接下來還可以通過size來定義按鈕的大小,如下圖所示,mini代表的就是小按鈕
uniapp按鈕樣式怎麼改
10

最後我們就可以看到按鈕變小了,這是經常會使用到的大小,如下圖所示
uniapp按鈕樣式怎麼改
END

⑦ ui怎麼設置button被選中後的背景顏色

1,通過按鈕的事件來設置背景色

- (void)viewDidLoad {
[super viewDidLoad];

UIButton *button1 = [[UIButton alloc] initWithFrame:CGRectMake(50, 200, 100, 50)];
[button1 setTitle:@"button1" forState:UIControlStateNormal];
button1.backgroundColor = [UIColor orangeColor];
[button1 addTarget:self action:@selector(button1BackGroundHighlighted:) forControlEvents:UIControlEventTouchDown];
[button1 addTarget:self action:@selector(button1BackGroundNormal:) forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:button1];
}

// button1普通狀態下的背景色
- (void)button1BackGroundNormal:(UIButton *)sender
{
sender.backgroundColor = [UIColor orangeColor];
}

// button1高亮狀態下的背景色
- (void)button1BackGroundHighlighted:(UIButton *)sender
{
sender.backgroundColor = [UIColor greenColor];
}

2,通過把顏色轉換為UIImage來作為按鈕不同狀態下的背景圖片

- (void)viewDidLoad {
[super viewDidLoad];

UIButton *button2 = [[UIButton alloc] initWithFrame:CGRectMake(170, 200, 100, 50)];
[button2 setTitle:@"button2" forState:UIControlStateNormal];
[button2 setBackgroundImage:[self imageWithColor:[UIColor redColor]] forState:UIControlStateNormal];
[button2 setBackgroundImage:[self imageWithColor:[UIColor grayColor]] forState:UIControlStateHighlighted];
[self.view addSubview:button2];
}

// 顏色轉換為背景圖片
- (UIImage *)imageWithColor:(UIColor *)color {
CGRect rect = CGRectMake(0.0f, 0.0f, 1.0f, 1.0f);
UIGraphicsBeginImageContext(rect.size);
CGContextRef context = UIGraphicsGetCurrentContext();

(context, [color CGColor]);
CGContextFillRect(context, rect);

UIImage *image = ();
UIGraphicsEndImageContext();

return image;
}

⑧ 請指教:如何改變button的背景色

換一個TBitbtm,設一下Glyph屬性實現起來比較簡單,試試看阿

⑨ 如何改變Button顏色

調色板類QPallete提供了顏色角色(color roles)概念,是指當前GUI界面中顏色的職責,通過枚舉變數QPalette::ColorRole來定義,比較常用的顏色角色有:
QPalete::Window,通常指窗口部件的背景色;
QPalette:WindowText,通常指窗口不見的前景色;
QPalette::Base,指文本輸入窗口部件(比如QtextEdit,QLinedit等)的背景色.
QPalette::Text,與QPalette::Base一塊使用,指文本輸入窗口部件的前景色;
QPalette::Button,指按鈕窗口部件的背景色;
QPalette::ButtonText,指按鈕窗口部件的前景色.

例:

QPalette pal = pushButtonCancel->palette();
pal.setColor(QColorGroup::ButtonText,QColor(255,0,0));
pushButtonCancel->setPalette(pal);

按鈕pushButton的字體顏色為紅色

⑩ button 點擊後怎麼改變背景顏色

HTML中點擊按鈕更改DIV背景顏色可以用JavaScript腳本實現: function changecolor(){ document.getElementById("div").style.background="red"; //更改為紅色}

閱讀全文

與uniapp如何改變按鈕的背景色相關的資料

熱點內容
程序員追愛 瀏覽:250
程序員邏輯故事 瀏覽:766
加密icsot23i2c 瀏覽:709
你們有什麼好的解壓軟體 瀏覽:605
常州空氣壓縮機廠家 瀏覽:239
安卓如何關閉app內彈出的更新提示 瀏覽:407
e4a寫的app怎麼裝蘋果手機 瀏覽:199
海立壓縮機海信系 瀏覽:208
社保如何在app上合並 瀏覽:220
小米加密照片後綴 瀏覽:234
我的世界網易手機怎麼創伺服器 瀏覽:978
載入單頁源碼 瀏覽:930
阿里雲伺服器seo 瀏覽:777
海洋斗什麼時候上線安卓 瀏覽:86
中行app如何查每日匯款限額 瀏覽:840
輸入伺服器sn是什麼意思 瀏覽:725
sha1演算法java 瀏覽:90
asp代碼壓縮 瀏覽:851
按鍵壓槍源碼 瀏覽:180
福建伺服器負載均衡是什麼 瀏覽:697