JAVA UIHarmonyOS 功能很强大的弹窗XPopup

 参考资料

XPopup

我们也可以参考Android的XPopup的框架去比较学习

api讲解

项目集成XPopup

1.我们需要在项目级的bulid.gradle 添加如下代码

1.  
   repositories {
2.  
   mavenCentral()
3.  
   }

2.我们在entry的目录下bulid.gradle 添加如下代码

implementation 'io.openharmony.tpc.thirdlib:XPopup:1.1.4'

普通的弹框

该方法是显示普通的弹框，详细api方法和注释见代码

1.  
   popupView = new XPopup.Builder(getContext())
2.  
   // 设置是否显示导航栏，默认是显示的。如果你希望弹窗隐藏导航栏，就设置为true
3.  
   .hasNavigationBar(false)
4.  
   /*
5.  
   * 是否在弹窗消失后就立即释放资源，杜绝内存泄漏，仅仅适用于弹窗只用一次的场景，默认为false。
6.  
   * 如果你的弹窗对象需是复用的，千万不要开启这个设置
7.  
   */
8.  
   .isDestroyOnDismiss(true)
9.  
   .hasBlurBg(true)//是否设置背景为高斯模糊背景。默认为false
10.  
    .dismissOnTouchOutside(false)//设置点击弹窗外面是否关闭弹窗，默认为true
11.  
    .autoDismiss(false)//设置当操作完毕后是否自动关闭弹窗，默认为true。比如：点击Confirm弹窗的确认按钮默认是关闭弹窗，如果为false，则不关闭
12.  
    .popupAnimation(PopupAnimation.NoAnimation)// 为弹窗设置内置的动画器，默认情况下，已经为每种弹窗设置了效果最佳的动画器；如果你不喜欢，仍然可以修改。
13.  
    /*
14.  
    * title:标题
15.  
    * content：内容
16.  
    * cancelBtnText：取消按钮文本(左边按钮文本)
17.  
    * confirmBtnText：确定按钮文本(右边按钮文本)
18.  
    * confirmListener：确定按钮点击事件(右边按钮点击事件)
19.  
    * cancelListener：取消按钮点击事件(左边按钮点击事件)
20.  
    * isHideCancel：是否隐藏左侧按钮(设置单个点击按钮使用)
21.  
    */
22.  
    .asConfirm("标题", "内容：床前明月光，疑是地上霜；举头望明月，低头思故乡。",
23.  
    "取消", "确定",
24.  
    new OnConfirmListener() {
25.  
    @Override
26.  
    public void onConfirm() {
27.  
    popupView.dismiss();
28.  
    }
29.  
     
30.  
    }, new OnCancelListener() {
31.  
    @Override
32.  
    public void onCancel() {
33.  
    popupView.dismiss();
34.  
    }
35.  
    }, false);
36.  
    popupView.show();

加载的弹框

该方法是显示加载的弹框，详细api方法和注释见代码

1.  
   if (loadingPopup == null) {
2.  
   loadingPopup = (LoadingPopupView) new XPopup.Builder(getContext())
3.  
   .dismissOnBackPressed(false)//todo 点击 弹框外部 加载框消失
4.  
   .asLoading("加载中")
5.  
   .show();
6.  
   } else {
7.  
   loadingPopup.show();
8.  
   }

代码实现

xml 布局创建

创建两个text按钮，分别是“普通的弹框”，“加载弹框”，作用分别是用于创建普通的弹框，和创建加载的弹框，代码如下

1.  
   <?xml version="1.0" encoding="utf-8"?>
2.  
   <DirectionalLayout
3.  
   xmlns:ohos="http://schemas.huawei.com/res/ohos"
4.  
   ohos:height="match_parent"
5.  
   ohos:width="match_parent"
6.  
   ohos:alignment="left"
7.  
   ohos:orientation="vertical">
8.  
    
9.  
   <Text
10.  
    ohos:id="$ id:text_Normal"
11.  
    ohos:height="100vp"
12.  
    ohos:text_alignment="center"
13.  
    ohos:width="match_content"
14.  
    ohos:layout_alignment="horizontal_center"
15.  
    ohos:text="普通弹框"
16.  
    ohos:text_size="40vp"
17.  
    />
18.  
     
19.  
    <Text
20.  
    ohos:id="$ id:text_load"
21.  
    ohos:height="100vp"
22.  
    ohos:text_alignment="center"
23.  
    ohos:width="match_parent"
24.  
    ohos:layout_alignment="horizontal_center"
25.  
    ohos:background_element="#ed6262"
26.  
    ohos:text="加载框"
27.  
    ohos:text_size="40vp"
28.  
    />
29.  
     
30.  
    </DirectionalLayout>

java 代码功能实现

代码分别实现这个功能，代码如下

1.  
   package com.newdemo.myapplication.slice;
2.  
    
3.  
   import com.lxj.xpopup.XPopup;
4.  
   import com.lxj.xpopup.core.BasePopupView;
5.  
   import com.lxj.xpopup.enums.PopupAnimation;
6.  
   import com.lxj.xpopup.impl.LoadingPopupView;
7.  
   import com.lxj.xpopup.interfaces.OnCancelListener;
8.  
   import com.lxj.xpopup.interfaces.OnConfirmListener;
9.  
   import com.lxj.xpopup.interfaces.XPopupCallback;
10.  
    import com.newdemo.myapplication.ResourceTable;
11.  
    import ohos.aafwk.ability.AbilitySlice;
12.  
    import ohos.aafwk.content.Intent;
13.  
    import ohos.agp.components.Component;
14.  
     
15.  
    public class MainAbilitySlice extends AbilitySlice {
16.  
    private BasePopupView popupView;
17.  
    private LoadingPopupView loadingPopup;
18.  
    @Override
19.  
    public void onStart(Intent intent) {
20.  
    super.onStart(intent);
21.  
    super.setUIContent(ResourceTable.Layout_ability_main);
22.  
     
23.  
    findComponentById(ResourceTable.Id_text_Normal).setClickedListener(new Component.ClickedListener() {
24.  
    @Override
25.  
    public void onClick(Component component) {
26.  
    popupView = new XPopup.Builder(getContext())
27.  
    // 设置是否显示导航栏，默认是显示的。如果你希望弹窗隐藏导航栏，就设置为true
28.  
    .hasNavigationBar(false)
29.  
    /*
30.  
    * 是否在弹窗消失后就立即释放资源，杜绝内存泄漏，仅仅适用于弹窗只用一次的场景，默认为false。
31.  
    * 如果你的弹窗对象需是复用的，千万不要开启这个设置
32.  
    */
33.  
    .isDestroyOnDismiss(true)
34.  
    .hasBlurBg(true)//是否设置背景为高斯模糊背景。默认为false
35.  
    .dismissOnTouchOutside(false)//设置点击弹窗外面是否关闭弹窗，默认为true
36.  
    .autoDismiss(false)//设置当操作完毕后是否自动关闭弹窗，默认为true。比如：点击Confirm弹窗的确认按钮默认是关闭弹窗，如果为false，则不关闭
37.  
    .popupAnimation(PopupAnimation.NoAnimation)// 为弹窗设置内置的动画器，默认情况下，已经为每种弹窗设置了效果最佳的动画器；如果你不喜欢，仍然可以修改。
38.  
    /*
39.  
    * title:标题
40.  
    * content：内容
41.  
    * cancelBtnText：取消按钮文本(左边按钮文本)
42.  
    * confirmBtnText：确定按钮文本(右边按钮文本)
43.  
    * confirmListener：确定按钮点击事件(右边按钮点击事件)
44.  
    * cancelListener：取消按钮点击事件(左边按钮点击事件)
45.  
    * isHideCancel：是否隐藏左侧按钮(设置单个点击按钮使用)
46.  
    */
47.  
    .asConfirm("标题", "内容：床前明月光，疑是地上霜；举头望明月，低头思故乡。",
48.  
    "取消", "确定",
49.  
    new OnConfirmListener() {
50.  
    @Override
51.  
    public void onConfirm() {
52.  
    popupView.dismiss();
53.  
    }
54.  
     
55.  
    }, new OnCancelListener() {
56.  
    @Override
57.  
    public void onCancel() {
58.  
    popupView.dismiss();
59.  
    }
60.  
    }, false);
61.  
    popupView.show();
62.  
    }
63.  
    });
64.  
    findComponentById(ResourceTable.Id_text_load).setClickedListener(new Component.ClickedListener() {
65.  
    @Override
66.  
    public void onClick(Component component) {
67.  
    if (loadingPopup == null) {
68.  
    loadingPopup = (LoadingPopupView) new XPopup.Builder(getContext())
69.  
    .dismissOnBackPressed(false)//todo 点击 弹框外部 加载框消失
70.  
    .asLoading("加载中")
71.  
    .show();
72.  
    } else {
73.  
    loadingPopup.show();
74.  
    }
75.  
    }
76.  
    });
77.  
     
78.  
    }
79.  
     
80.  
    @Override
81.  
    public void onActive() {
82.  
    super.onActive();
83.  
    }
84.  
     
85.  
    @Override
86.  
    public void onForeground(Intent intent) {
87.  
    super.onForeground(intent);
88.  
    }
89.  
    }

运行效果

 欲了解更多更全技术文章，欢迎访问https://developer.huawei.com/consumer/cn/forum/?ha_source=zzh

这篇好文章是转载于：学新通技术网