Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537 Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537
先,在一個Form窗口中,我們可以定義3個radiobutton,radioButton1、radioButton2和radioButton3,以及button1和button2(這里可以是其他控件)。
為了實現單擊radioButton1時,button1顯示"A1",button2顯示"A2";
單擊radioButton2時,button1顯示"B1",button2顯示"B2";
單擊radioButton3時,button1顯示"C1",button2顯示"C2".
下面的代碼就可以實現這個功能:
文介紹在鴻蒙應用中RadioButton和RadioContainer組件的基本用法。
<script src="https://lf6-cdn-tos.bytescm.com/obj/cdn-static-resource/tt_player/tt.player.js?v=20160723"></script>
增加RadioButton和RadioContainer組件
如下代碼中46行~66行所示,在布局中增加RadioButton和RadioContainer組件。
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout
xmlns:ohos="http://schemas.huawei.com/res/ohos"
ohos:height="match_parent"
ohos:width="match_parent"
ohos:orientation="vertical">
<Component
ohos:height="0vp"
ohos:weight="3"
ohos:width="match_parent"
/>
<DirectionalLayout
xmlns:ohos="http://schemas.huawei.com/res/ohos"
ohos:height="match_content"
ohos:width="match_content"
ohos:layout_alignment="center"
ohos:orientation="vertical">
<Image
ohos:id="$+id:image"
ohos:width="match_content"
ohos:height="match_content"
ohos:layout_alignment="center"
ohos:image_src="$media:DevEco"
/>
<TextField
ohos:id="$+id:text_field"
ohos:width="match_parent"
ohos:height="30vp"
ohos:text_size="20fp"
ohos:text_alignment="center"
ohos:hint="Please input text and press [Click me!] button."
ohos:background_element="$graphic:background_text_field"
/>
<Button
ohos:id="$+id:hello_button"
ohos:width="match_content"
ohos:height="match_content"
ohos:text_size="27fp"
ohos:text="Click me!"
ohos:layout_alignment="center"
ohos:background_element="$graphic:background_button"
ohos:margin="15vp"
ohos:right_padding="8vp"
ohos:left_padding="8vp"
/>
<RadioContainer
ohos:id="$+id:radio_container"
ohos:height="match_content"
ohos:width="match_content"
ohos:top_margin="32vp"
ohos:layout_alignment="horizontal_center"
ohos:orientation="horizontal">
<RadioButton
ohos:id="$+id:r24h"
ohos:height="40vp"
ohos:width="match_content"
ohos:text="24H"
ohos:marked="true"
ohos:text_size="20fp"/>
<RadioButton
ohos:id="$+id:r12h"
ohos:height="40vp"
ohos:width="match_content"
ohos:text="12H"
ohos:text_size="20fp"/>
</RadioContainer>
<TimePicker
ohos:id="$+id:time_picker"
ohos:24_hour_mode="false"
ohos:height="match_content"
ohos:width="match_parent"
ohos:layout_alignment="horizontal_center"
ohos:text_am="AM"
ohos:text_pm="PM"
ohos:normal_text_size="20fp"
ohos:selected_text_size="25fp"/>
</DirectionalLayout>
<Component
ohos:height="0vp"
ohos:weight="5"
ohos:width="match_parent"
/>
</DirectionalLayout>
代碼中組件id被指定為radio_container,會在下面的響應代碼中用到。
在代碼中使用RadioButton和RadioContainer組件
下面代碼中的第18行獲取RadioContainer組件后,在第22行根據RadioContainer的狀態更新TimePicker的形式,然后在第40行~43行為RadioContainer增加響應處理,其內容是同樣是根據選中的RadioButton的索引更新TimePicker的形式。
import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.components.*;
import ohos.agp.window.dialog.ToastDialog;
import java.time.LocalTime;
import java.time.temporal.ChronoUnit;
public class ComponentAbilitySlice extends AbilitySlice {
@Override
public void onStart(Intent intent) {
super.onStart(intent);
super.setUIContent(ResourceTable.Layout_ability_component);
//獲取textfield輸入組件
TextField tf=(TextField) findComponentById(ResourceTable.Id_text_field);
//獲取button組件
Button button=(Button) findComponentById(ResourceTable.Id_hello_button);
//獲取RedioContainer組件
RadioContainer rcontainer=(RadioContainer)findComponentById(ResourceTable.Id_radio_container);
//獲取TimePicker組件
TimePicker picker=(TimePicker) findComponentById(ResourceTable.Id_time_picker);
//根據RadioContainer的狀態設定TimePicker的形式。
picker.set24Hour(rcontainer.getMarkedButtonId()==0);
// 為按鈕設置點擊事件回調
button.setClickedListener(new Component.ClickedListener() {
public void onClick(Component v) {
LocalTime rightNow=LocalTime.now();
LocalTime pickTime=LocalTime.of(picker.getHour(), picker.getMinute(), picker.getSecond());
String msg;
if(pickTime.isBefore(rightNow))
msg="所選時間比現在時刻早" + pickTime.until(rightNow, ChronoUnit.SECONDS) + "秒";
else if(pickTime.isAfter(rightNow))
msg="所選時間比現在時刻晚" + rightNow.until(pickTime, ChronoUnit.SECONDS) + "秒";
else
msg="所選時間和現在時刻一樣";
new ToastDialog(getContext())
.setText(msg)
.show();
}
});
//為RadioContainer設置事件響應
rcontainer.setMarkChangedListener((radioContainer1, index) -> {
picker.set24Hour(index==0);
});
//為TimePicker設定事件響應
picker.setTimeChangedListener(
new TimePicker.TimeChangedListener() {
@Override
public void onTimeChanged(TimePicker timePicker, int hour, int minute, int second) {
tf.setText(hour + ":" + minute + ":" + second);
}
}
);
}
@Override
public void onActive() {
super.onActive();
}
@Override
public void onForeground(Intent intent) {
super.onForeground(intent);
}
}
畫面顯示如下:
參考文檔
RadioContainer組件:
https://developer.harmonyos.com/cn/docs/documentation/doc-guides/ui-java-component-radiocontainer-0000001063470429
RadioContainer類:
https://developer.harmonyos.com/cn/docs/documentation/doc-references/radiocontainer-0000001054678720
RadioButton組件
https://developer.harmonyos.com/cn/docs/documentation/doc-guides/ui-java-component-radiobutton-0000001060647792
RadioButton類
https://developer.harmonyos.com/cn/docs/documentation/doc-references/radiobutton-0000001054518732
新書介紹
《實戰Python設計模式》是作者最近出版的新書,拜托多多關注!
本書利用Python 的標準GUI 工具包tkinter,通過可執行的示例對23 個設計模式逐個進行說明。這樣一方面可以使讀者了解真實的軟件開發工作中每個設計模式的運用場景和想要解決的問題;另一方面通過對這些問題的解決過程進行說明,讓讀者明白在編寫代碼時如何判斷使用設計模式的利弊,并合理運用設計模式。
對設計模式感興趣而且希望隨學隨用的讀者通過本書可以快速跨越從理解到運用的門檻;希望學習Python GUI 編程的讀者可以將本書中的示例作為設計和開發的參考;使用Python 語言進行圖像分析、數據處理工作的讀者可以直接以本書中的示例為基礎,迅速構建自己的系統架構。
覺得本文有幫助?請分享給更多人。
關注微信公眾號【面向對象思考】輕松學習每一天!
面向對象開發,面向對象思考!
篇文章主要的向大家介紹了關于html input標簽的單選按鈕的使用方法,還有關于HTML input標簽的單選默認按鈕的做法。接下來我們一起來看看這篇文章吧
<input> 標簽用于搜集用戶信息。根據不同的type屬性值,輸入字段擁有很多種形式。輸入字段可以是文本字段、復選框、掩碼后的文本控件、單選按鈕、按鈕等等。
> <form action="form_action.asp" method="get">
>
> <input type="radio" name="radio" value="1">單選1
>
> <input type="radio" name="radio" value="2">單選2
>
> <input type="radio" name="radio" value="3">單選3
>
> <input type="radio" name="radio" value="4">單選4
>
> </form>
這個的效果很容易看到,我們還是先看看瀏覽器中的顯示效果吧:
這個效果一眼就能看到,很簡單的一個代碼
還有種是很多網站上都是經常見到的,比如:單選性別,這個基本上都是用這種單選框去制作的。代碼如下:
HTML中的單選按鈕實現男女性別選擇,不讓男女同是都能都能選擇,實現方法:在按鈕的屬性里寫一個name屬性,并且把name的值設置成相同的
> <input id="man" type="radio" checked="checked" name="1" />男
>
> <input id="woman" type="radio" name="1"/>女
這個就不給圖了,比上面那個還簡單,就兩個單選框,我們經常遇到的這個。
現在來說說HTML單選框按鈕怎么默認選中:
首先我們先把第一個實例拿出來繼續說,我們只需要在其中加一個屬性,如下:
> <form action="form_action.asp" method="get">
>
> <input type="radio" name="radio" value="1">單選1
>
> <input type="radio" name="radio" value="2" checked>單選2
>
> <input type="radio" name="radio" value="3">單選3
>
> <input type="radio" name="radio" value="4">單選4
>
> </form>
這上面我沒做任何的點擊,自己出現在那上面的,刷新過后還能看到在單選2上面。
我們就可以看到,這樣就把單選框給默認選中了,大家可以自己試試,多敲敲代碼。
好了,以上就是這篇關于html input標簽做單選按鈕的文章了,有問題的可以在下方提問。
以上就是html單選按鈕默認選中怎么做?input標簽的單選按鈕用法實例的詳細內容,更多請關注我?。。?/p>
我自己是一名從事了多年開發的web前端老程序員,目前辭職在做自己的web前端私人定制課程,今年我花了一個月整理了一份最適合2020年學習的web前端學習干貨,各種框架都有整理,送給每一位前端小伙伴,想要獲取的可以關注我的頭條號并在后臺私信我:前端,即可免費獲取。
*請認真填寫需求信息,我們會在24小時內與您取得聯系。