文章目錄
-
- 1、ToastDialog 是什麼?
- 2、簡單實用
- 3、設定 ToastDialog
- 4、自定義ToastDialog的Component
- 5、實戰:自定義添加多個視圖的場景
- 6、更多
1、ToastDialog 是什麼?
簡單:提示對話框
官方:ToastDialog是在視窗上方彈出的對話框,是通知操作的簡單回報。ToastDialog會在一段時間後消失,在此期間,使用者還可以操作目前視窗的其他元件。
2、簡單實用
Button button = (Button) findComponentById(ResourceTable.Id_btn_dianwo);
button.setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
//建立一個ToastDialog
new ToastDialog(getContext())
.setText("This is a ToastDialog")
.show();
}
});
<Button
ohos:id="$+id:btn_dianwo"
ohos:height="match_content"
ohos:width="match_parent"
ohos:layout_alignment="center"
ohos:text="點我"
ohos:margin="40fp"
ohos:text_size="25fp"
ohos:background_element="#FF53C3DE"/>
3、設定 ToastDialog
(1)設定位置
new ToastDialog(getContext())
.setText("This is a ToastDialog displayed in the middle")
.setAlignment(LayoutAlignment.CENTER)
.show();
4、自定義ToastDialog的Component
建立:layout_toast.xml
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout
xmlns:ohos="http://schemas.huawei.com/res/ohos"
ohos:height="match_content"
ohos:width="match_content"
ohos:orientation="vertical">
<Text
ohos:id="$+id:msg_toast"
ohos:height="match_content"
ohos:width="match_content"
ohos:left_padding="16vp"
ohos:right_padding="16vp"
ohos:top_padding="4vp"
ohos:bottom_padding="4vp"
ohos:layout_alignment="center"
ohos:text_size="16fp"
ohos:text="This is a ToastDialog for the customized component"
ohos:background_element="$graphic:background_toast_element"/>
</DirectionalLayout>
background_toast_element.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:ohos="http://schemas.huawei.com/res/ohos"
ohos:shape="rectangle">
<corners
ohos:radius="30vp"/>
<solid
ohos:color="#66808080"/>
</shape>
Button button = (Button) findComponentById(ResourceTable.Id_btn_dianwo);
button.setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
//自定義ToastDialog的Component
DirectionalLayout toastLayout = (DirectionalLayout) LayoutScatter.getInstance(MainAbilitySlice.this)
.parse(ResourceTable.Layout_layout_toast, null, false);
new ToastDialog(getContext())
.setContentCustomComponent(toastLayout)
.setSize(DirectionalLayout.LayoutConfig.MATCH_CONTENT, DirectionalLayout.LayoutConfig.MATCH_CONTENT)
.setAlignment(LayoutAlignment.CENTER)
.show();
}
});
5、實戰:自定義添加多個視圖的場景
建立:layout_toast_and_image.xml
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout
xmlns:ohos="http://schemas.huawei.com/res/ohos"
ohos:height="match_content"
ohos:width="match_content"
ohos:orientation="horizontal">
<Image
ohos:width="30vp"
ohos:height="30vp"
ohos:scale_mode="inside"
ohos:image_src="$media:icon"/>
<Text
ohos:id="$+id:msg_toast"
ohos:height="match_content"
ohos:width="match_content"
ohos:background_element="$graphic:background_toast_element"
ohos:bottom_padding="4vp"
ohos:layout_alignment="vertical_center"
ohos:left_padding="16vp"
ohos:right_padding="16vp"
ohos:text="This is a ToastDialog with An Image"
ohos:text_size="16fp"
ohos:top_padding="4vp"/>
</DirectionalLayout>
background_toast_element.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:ohos="http://schemas.huawei.com/res/ohos"
ohos:shape="rectangle">
<corners
ohos:radius="30vp"/>
<solid
ohos:color="#66808080"/>
</shape>
Button button = (Button) findComponentById(ResourceTable.Id_btn_dianwo);
button.setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
DirectionalLayout layout = (DirectionalLayout) LayoutScatter.getInstance(MainAbilitySlice.this)
.parse(ResourceTable.Layout_layout_toast_and_image, null, false);
new ToastDialog(getContext())
.setContentCustomComponent(layout)
.setSize(DirectionalLayout.LayoutConfig.MATCH_CONTENT, DirectionalLayout.LayoutConfig.MATCH_CONTENT)
.setAlignment(LayoutAlignment.CENTER)
.show();
}
});
6、更多
ToastDialog 更多