HarmonyOS之常用组件ToastDialog的功能和使用

一、ToastDialog 的使用

• ToastDialog 是在窗口上方弹出的对话框，是通知操作的简单反馈。ToastDialog 会在一段时间后消失，在此期间，用户还可以操作当前窗口的其他组件。
• 创建一个 ToastDialog：

	new ToastDialog(getContext())
	        .setText("This is a ToastDialog")
	        .show();

  

 

  
1
  
2
  
3
 

• • ToastDialog 效果图如下：

• 设置位置：

	new ToastDialog(getContext())
	    .setText("This is a ToastDialog displayed in the middle")
	    .setAlignment(LayoutAlignment.CENTER)
	    .show();

  

 

  
1
  
2
  
3
  
4
 

• • 设置显示位置的效果：

• 自定义 ToastDialog 的 Component：
• • Java 代码示例：

	DirectionalLayout toastLayout = (DirectionalLayout) LayoutScatter.getInstance(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();

  

 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
 

• • 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>    

  

 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
  
9
  
10
  
11
  
12
  
13
  
14
  
15
  
16
  
17
  
18
  
19
 

• • 其中 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>

  

 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
 

• • 自定义 Component 效果：

二、场景示例

• 自定义视图：添加多个视图的场景。自定义多个组件的效果如下：

• 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>

  

 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
  
9
  
10
  
11
  
12
  
13
  
14
  
15
  
16
  
17
  
18
  
19
  
20
  
21
  
22
  
23
  
24
  
25
  
26
 

• • 其中 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>

  

 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
 

• • Java 示例代码：

	DirectionalLayout layout = (DirectionalLayout) LayoutScatter.getInstance(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();

  

 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
 

文章来源: blog.csdn.net，作者：Serendipity·y，版权归原作者所有，如需转载，请联系作者。

原文链接：blog.csdn.net/Forever_wj/article/details/119323106