百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 编程字典 > 正文

HarmonyOS学习路之开发篇—Java UI框架(基础组件说明「三」)

toyiye 2024-09-16 05:58 3 浏览 0 评论

接上一篇文章…
上两篇文章已经介绍了大部分的Java UI组件 ,因为时间关系把一个内容分为了三个部分,这是最后一篇组件的介绍。分别介绍ListContainer、ScrollView和WebView。

二、分类说明

?ListContainer

ListContainer是用来呈现连续、多行数据的组件,包含一系列相同类型的列表项。

ListContainer和ScrollView在介绍嵌套开发时使用到了其中的一些属性,但是没有具体的介绍说明。

ListContainer的共有XML属性继承自:Component,其基础属性就不再过多的赘述。ListContainer的自有XML属性见下表:

属性名称

属性描述

使用案例

rebound_effect

开启/关闭回弹效果

ohos:rebound_effect=“true”

shader_color

着色器颜色

ohos:shader_color="#A8FFFFFF"

orientation

列表项排列方向

ohos:orientation=“horizontal” or ohos:orientation=“vertical”

使用ListContainer时,需要编写适配器来构造不同的数据结构,在编写适配器时需要注意:要继承自BaseItemProvider并重写以下方法;

方法

描述

int getCount()

返回填充的表项个数。

Object getItem(int position)

根据position返回对应的数据。

long getItemId(int position)

返回某一项的id。

Component getComponent(int position, Component covertComponent,ComponentContainer componentContainer)

根据position返回对应的界面组件。

?ScrollView

ScrollView是一种带滚动功能的组件,它采用滑动的方式在有限的区域内显示更多的内容。

ScrollView的共有XML属性继承自:StackLayout,ScrollView的自有XML属性见下表:

属性名称

属性描述

使用案例

match_viewport

是否拉伸匹配(boolean类型)

ohos:match_viewport=“true”

rebound_effect

回弹效果(boolean类型)

ohos:rebound_effect=“true”

ScrollView的速度、滚动、回弹等常用接口如下:

方法

描述

doFling(int velocityX, int velocityY)



设置X轴和Y轴滚动的初始速度,单位(px)

doFlingX(int velocityX)

doFlingY(int velocityY)

fluentScrollBy(int dx, int dy)


沿坐标轴将内容平滑地移动指定数量的像素,单位(px)

fluentScrollByX(int dx)

fluentScrollByY(int dy)

fluentScrollTo(int x, int y)

根据指定坐标平滑滚动到指定位置,单位(px)

fluentScrollXTo(int x)

fluentScrollYTo(int y)

setReboundEffect(boolean enabled)

设置是否启用回弹效果,默认false

setReboundEffectParams(int overscrollPercent, float overscrollRate, int remainVisiblePercent)

配置回弹效果

setReboundEffectParams(ReboundEffectParams reboundEffectParams)

overscrollPercent:过度滚动百分比,默认值40

setOverscrollPercent(int overscrollPercent)

overscrollRate:过度滚动率,默认值0.6

setOverscrollRate(float overscrollRate)

remainVisiblePercent:应保持可见内容的最小百分比,默认值20

setRemainVisiblePercent(int remainVisiblePercent)


?WebView

WebView提供在应用中集成Web页面的能力。

在使用WebView时需要配置应用的网络权限。打开“entry > src > main > config.json”,并添加如下配置。

{
  ...
  "module": {
    ...
    "reqPermissions": [
      {
        "name": "ohos.permission.INTERNET"
      }
    ],
    ...
  }
}

与Android中的Webview有着一样的功能,显示相应的网页数据,并且可以与JavaScript代码相互调用。

通过WebConfig启用JavaScript

webView.getWebConfig().setJavaScriptPermit(true);

使用回调方法或者应用内部调用JavaScript方法。

  • 注入回调对象到页面内容
final String jsName = "JsCallbackToApp";
webView.addJsCallback(jsName, new JsCallback() {
    @Override
    public String onCallback(String msg) {
        // 增加自定义处理
        return "jsResult";
    }
});
//---------------------------------------------
function callToApp() {
    if (window.JsCallbackToApp && window.JsCallbackToApp.call) {
       var result = JsCallbackToApp.call("message from web");
    }
}
  • 在应用内调用页面内的JavaScript方法
webView.executeJs("javascript:callFuncInWeb()", new AsyncCallback<String>() {
    @Override
    public void onReceive(String msg) {
        // 在此确认返回结果
    }
});

观测Web状态

通过setWebAgent方法设置自定义WebAgent对象,以观测页面状态变更等事件:

webView.setWebAgent(new WebAgent() {
    @Override
    public void onLoadingPage(WebView webview, String url, PixelMap favicon) {
        super.onLoadingPage(webview, url, favicon);
        // 页面开始加载时自定义处理
    }

    @Override
    public void onPageLoaded(WebView webview, String url) {
        super.onPageLoaded(webview, url);
        // 页面加载结束后自定义处理
    }

    @Override
    public void onLoadingContent(WebView webview, String url) {
        super.onLoadingContent(webview, url);
        // 加载资源时自定义处理
    }

    @Override
    public void onError(WebView webview, ResourceRequest request, ResourceError error) {
        super.onError(webview, request, error);
        // 发生错误时自定义处理
    }
});

相关推荐

为何越来越多的编程语言使用JSON(为什么编程)

JSON是JavascriptObjectNotation的缩写,意思是Javascript对象表示法,是一种易于人类阅读和对编程友好的文本数据传递方法,是JavaScript语言规范定义的一个子...

何时在数据库中使用 JSON(数据库用json格式存储)

在本文中,您将了解何时应考虑将JSON数据类型添加到表中以及何时应避免使用它们。每天?分享?最新?软件?开发?,Devops,敏捷?,测试?以及?项目?管理?最新?,最热门?的?文章?,每天?花?...

MySQL 从零开始:05 数据类型(mysql数据类型有哪些,并举例)

前面的讲解中已经接触到了表的创建,表的创建是对字段的声明,比如:上述语句声明了字段的名称、类型、所占空间、默认值和是否可以为空等信息。其中的int、varchar、char和decimal都...

JSON对象花样进阶(json格式对象)

一、引言在现代Web开发中,JSON(JavaScriptObjectNotation)已经成为数据交换的标准格式。无论是从前端向后端发送数据,还是从后端接收数据,JSON都是不可或缺的一部分。...

深入理解 JSON 和 Form-data(json和formdata提交区别)

在讨论现代网络开发与API设计的语境下,理解客户端和服务器间如何有效且可靠地交换数据变得尤为关键。这里,特别值得关注的是两种主流数据格式:...

JSON 语法(json 语法 priority)

JSON语法是JavaScript语法的子集。JSON语法规则JSON语法是JavaScript对象表示法语法的子集。数据在名称/值对中数据由逗号分隔花括号保存对象方括号保存数组JS...

JSON语法详解(json的语法规则)

JSON语法规则JSON语法是JavaScript对象表示法语法的子集。数据在名称/值对中数据由逗号分隔大括号保存对象中括号保存数组注意:json的key是字符串,且必须是双引号,不能是单引号...

MySQL JSON数据类型操作(mysql的json)

概述mysql自5.7.8版本开始,就支持了json结构的数据存储和查询,这表明了mysql也在不断的学习和增加nosql数据库的有点。但mysql毕竟是关系型数据库,在处理json这种非结构化的数据...

JSON的数据模式(json数据格式示例)

像XML模式一样,JSON数据格式也有Schema,这是一个基于JSON格式的规范。JSON模式也以JSON格式编写。它用于验证JSON数据。JSON模式示例以下代码显示了基本的JSON模式。{"...

前端学习——JSON格式详解(后端json格式)

JSON(JavaScriptObjectNotation)是一种轻量级的数据交换格式。易于人阅读和编写。同时也易于机器解析和生成。它基于JavaScriptProgrammingLa...

什么是 JSON:详解 JSON 及其优势(什么叫json)

现在程序员还有谁不知道JSON吗?无论对于前端还是后端,JSON都是一种常见的数据格式。那么JSON到底是什么呢?JSON的定义...

PostgreSQL JSON 类型:处理结构化数据

PostgreSQL提供JSON类型,以存储结构化数据。JSON是一种开放的数据格式,可用于存储各种类型的值。什么是JSON类型?JSON类型表示JSON(JavaScriptO...

JavaScript:JSON、三种包装类(javascript 包)

JOSN:我们希望可以将一个对象在不同的语言中进行传递,以达到通信的目的,最佳方式就是将一个对象转换为字符串的形式JSON(JavaScriptObjectNotation)-JS的对象表示法...

Python数据分析 只要1分钟 教你玩转JSON 全程干货

Json简介:Json,全名JavaScriptObjectNotation,JSON(JavaScriptObjectNotation(记号、标记))是一种轻量级的数据交换格式。它基于J...

比较一下JSON与XML两种数据格式?(json和xml哪个好)

JSON(JavaScriptObjectNotation)和XML(eXtensibleMarkupLanguage)是在日常开发中比较常用的两种数据格式,它们主要的作用就是用来进行数据的传...

取消回复欢迎 发表评论:

请填写验证码