0
  • 聊天消息
  • 系统消息
  • 评论与回复
登录后你可以
  • 下载海量资料
  • 学习在线课程
  • 观看技术视频
  • 写文章/发帖/加入社区
创作中心

完善资料让更多小伙伴认识你,还能领取20积分哦,立即完善>

3天内不再提示

鸿蒙ArkUI【开发移植Carbon】

jf_46214456 来源:jf_46214456 作者:jf_46214456 2024-03-25 15:41 次阅读

项目介绍

本项目是基于开源项目[Carbon] 进行harmonyos化的移植和开发的。

移植版本:Branches/master

这不是单纯只是API和基本功能展示demo,它是最有用的自定义控件的实现,如设计规范中所示。
Carbon试图:

  • 让事情变得更简单(指定cornerRadius='dp' 而不是创建一个xml 和/或一个ViewOutlineProvider)
  • 使其全部工作并在所有 API 上看起来都相同(例如 CheckBox 的左填充)
  • 真正向后移植功能(不要对阴影使用渐变!)

项目名称:Carbon

所属系列:harmonyos的第三方组件适配移植

功能:一个适用于鸿蒙的自定义组件框架,帮助快速实现各种需要的效果

项目移植状态:大部分移植

调用差异:基本没有使用差异,可以参照单元测试或原项目api进行使用

支持功能

  • 支持自定义progressBar功能
  • 支持自定义RoundProgressBar功能
  • 支持Button不同点击效果功能
  • 支持自定义SeekBar滑动功能
  • 支持各种动画效果展示
  • 支持添加收藏组件,快速查找
  • 支持各种列表展示(包含头像,文字等)功能
  • 支持展示控件代码功能
  • 支持不同Dialog效果展示
  • 以及其它自定义效果/控件

安装教程

方案一

可以先下载项目,将项目中的carbon库提取出来放在所需项目中通过build配置

dependencies {
     implementation project(":carbon")
}

方案二

  • 1.项目根目录的build.gradle中的repositories添加:
buildscript {
       repositories {
           ...
           mavenCentral()
       }
       ...
   }
   
   allprojects {
       repositories {
           ...
           mavenCentral()
       }
   }
dependencies {
    implementation 'com.gitee.ts_ohos:carbon:1.0.0'
}

使用说明

1.权限

需要网络权限:
"name": "ohos.permission.INTERNET"

2.代码使用

打开不同的设置页面:  
            often_text.setClickedListener(component - > {
                Intent intent = new Intent();
                if (often_text.getText().equals("Widget animations")) {
                    present(new WidgetAnimationsSlice(), intent);
                } else if (often_text.getText().equals("Image fade")) {
                    present(new ImageFadeSlice(), intent);
                } else if (often_text.getText().equals("Touch ripple")) {
                    present(new TouchRippleSlice(), intent);
                } else if (often_text.getText().equals("Path animation")) {
                    present(new PathAnimationSlice(), intent);
                }
...

        // BORDERLESS 触摸事件监听器(按下/抬起)(three)
        btnBorderless.setTouchEventListener(new Component.TouchEventListener() {
            @Override
            public boolean onTouchEvent(Component component, TouchEvent touchEvent) {
                int action = touchEvent.getAction();
                switch (action) {
                    case TouchEvent.PRIMARY_POINT_DOWN:
                        imageView.setVisibility(Component.VISIBLE);
                        break;
                    case TouchEvent.CANCEL:
                    case TouchEvent.PRIMARY_POINT_UP:
                        imageView.setVisibility(Component.HIDE);
                        break;
                }
                return true;
            }
        });

        //对每个条目判断是否收藏:
        mList.add(new DataBean(null, "The most popular problem solutions and other fun ideas implemented with Carbon's widgets and features", null, null));
        mList.add(new DataBean(power, "Power Menu", null, preferences.getBoolean("Power Menu", false) ? starFavour : favour));
        mList.add(new DataBean(null, "Auto Complete", element, preferences.getBoolean("Auto Complete", false) ? starFavour : favour));
        mList.add(new DataBean(null, "Quick Return", null, preferences.getBoolean("Quick Return", false) ? starFavour : favour));
        mList.add(new DataBean(search, "Search Toolbar", null, preferences.getBoolean("Search Toolbar", false) ? starFavour : favour));
        mList.add(new DataBean(parse1, "Share toolbar", element, preferences.getBoolean("Share toolbar", false) ? starFavour : favour));
        mList.add(new DataBean(person, "Profile", null, preferences.getBoolean("Profile", false) ? starFavour : favour));
        mList.add(new DataBean(player, "Music player", element, preferences.getBoolean("Music player", false) ? starFavour : favour));
        mList.add(new DataBean(null, "Collapsing toolbar", null, preferences.getBoolean("Collapsing toolbar", false) ? starFavour : favour));

更多鸿蒙开发学习内容[gitee.com/li-shizhen-skin/harmony-os/blob/master/README.md]前往参考学习。

鸿蒙系统移植和裁剪定制.png

效果演示

demo部分组件运行效果如下:

  • 主页展示效果
  • What's new界面展示效果
  • 收藏页面展示
  • Line chart页面运行效果
  • Theme页面运行效果
  • Backdrop及展开页面运行效果
  • Profiles页面运行效果
  • Circular_progress页面运行效果
  • Meuns页面运行效果
  • Music_player页面运行效果
  • Settings页面运行效果

主页运行效果what_new展开页面运行效果

favourties展开页面运行效果

line chart页面运行效果theme运行效果

backdrop运行效果backdrop展开页面运行效果

profiles运行效果

circular_progress运行效果meuns运行效果

music_player展开页面运行效果

settings展开页面运行效果

审核编辑 黄宇

声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉
  • 开源
    +关注

    关注

    3

    文章

    2991

    浏览量

    41723
  • 鸿蒙
    +关注

    关注

    55

    文章

    1641

    浏览量

    42123
收藏 人收藏

    评论

    相关推荐

    基于ArkUI eTS开发的坚果食谱(NutRecipes)

    基于ArkUI eTS开发的坚果食谱(NutRecipes)
    的头像 发表于 08-18 08:23 1233次阅读
    基于<b class='flag-5'>ArkUI</b> eTS<b class='flag-5'>开发</b>的坚果食谱(NutRecipes)

    鸿蒙ArkUI开发-Video组件的使用

    以视频功能为例,在应用开发过程中,我们需要通过ArkUI提供的Video组件为应用增加基础的视频播放功能。借助Video组件,我们可以实现视频的播放功能并控制其播放状态。常见的视频播放场景包括观看网络上的较为流行的短视频,也包括查看我们存储在本地的视频内容。
    的头像 发表于 01-23 16:59 619次阅读
    <b class='flag-5'>鸿蒙</b><b class='flag-5'>ArkUI</b><b class='flag-5'>开发</b>-Video组件的使用

    鸿蒙开发实战:基于【Markwon】移植开发

    本项目是基于开源项目**Markwon**进行适用harmonyos的移植开发的。
    的头像 发表于 03-25 16:27 467次阅读
    <b class='flag-5'>鸿蒙</b><b class='flag-5'>开发</b>实战:基于【Markwon】<b class='flag-5'>移植</b>和<b class='flag-5'>开发</b>

    鸿蒙ArkUI开发学习:【渲染控制语法】

    ArkUI开发框架是一套构建 HarmonyOS / OpenHarmony 应用界面的声明式UI开发框架,它支持程序使用 `if/else` 条件渲染, `ForEach` 循环渲染以及 `LazyForEach` 懒加载渲染
    的头像 发表于 04-09 16:40 429次阅读
    <b class='flag-5'>鸿蒙</b><b class='flag-5'>ArkUI</b><b class='flag-5'>开发</b>学习:【渲染控制语法】

    鸿蒙这么大声势,为何迟迟看不见岗位?最新数据来了

    联合打造的《鸿蒙NEXT星河版OpenHarmony开发文档》里面内容包含了ArkTS语言、ArkUI声明式UI开发、Stage模型入门、OpenHarmony多媒体技术、
    发表于 02-29 20:53

    【连载】信盈达实力大佬讲师带你学习鸿蒙系统移植和驱动开发

    鸿蒙开发课程介绍:第一节鸿蒙操作系统需要安装的软件有哪些,本节课将会重点介绍软件的安装步骤,以及如何获取安装包。连载中...第二节接着将带领大家进行u-boot、内核、根文件系统的移植
    发表于 09-11 10:25

    RISC-V MCU开发实战 (三):移植鸿蒙OS项目

    移植鸿蒙OS项目
    的头像 发表于 11-01 11:08 2613次阅读
    RISC-V MCU<b class='flag-5'>开发</b>实战 (三):<b class='flag-5'>移植</b><b class='flag-5'>鸿蒙</b>OS项目

    鸿蒙系统开发教程_韦东山 2-1移植RTOS需要做的事

    鸿蒙系统开发教程_韦东山 2-1移植RTOS需要做的事
    发表于 11-13 21:06 17次下载
    <b class='flag-5'>鸿蒙</b>系统<b class='flag-5'>开发</b>教程_韦东山  2-1<b class='flag-5'>移植</b>RTOS需要做的事

    如何在鸿蒙系统上弄一个ArkUI应用

          大家可以看到很明显这是一个 ArkUI 的应用,在远程模拟器上目前还只可以跑在 P40 Pro 上。    其实为了这个目的,只需要做到两个步骤,第一步整出一个 ArkUI 的应用来
    的头像 发表于 11-15 09:28 2451次阅读
    如何在<b class='flag-5'>鸿蒙</b>系统上弄一个<b class='flag-5'>ArkUI</b>应用

    适用于鸿蒙的自定义组件框架Carbon案例教程

    项目名称:Carbon 所属系列:ohos的第三方组件适配移植 功能:一个适用于鸿蒙的自定义组件框架,帮助快速实现各种需要的效果 项目移植状态:大部分
    发表于 04-07 09:49 5次下载

    ArkUI新能力,助力应用开发更便捷

    作者:niulihua,华为ArkUI技术专家;wanglei,华为ArkUI技术专家 ArkUI是一套构建分布式应用的声明式UI开发框架。它具备简洁自然的UI信息语法、丰富的UI组件
    的头像 发表于 02-15 16:35 672次阅读

    鸿蒙ArkUI开发-Tabs组件的使用

    鸿蒙ArkUI开发-Tabs组件的使用
    的头像 发表于 01-19 16:01 441次阅读
    <b class='flag-5'>鸿蒙</b><b class='flag-5'>ArkUI</b><b class='flag-5'>开发</b>-Tabs组件的使用

    鸿蒙ArkUI开发-应用添加弹窗

    弹窗是一种模态窗口,通常用来展示用户当前需要的或用户必须关注的信息或操作。在弹出框消失之前,用户无法操作其他界面内容。ArkUI为我们提供了丰富的弹窗功能
    的头像 发表于 01-24 17:22 267次阅读
    <b class='flag-5'>鸿蒙</b><b class='flag-5'>ArkUI</b><b class='flag-5'>开发</b>-应用添加弹窗

    使用 Taro 开发鸿蒙原生应用 —— 快速上手,鸿蒙应用开发指南

    随着鸿蒙系统的不断完善,许多应用厂商都希望将自己的应用移植鸿蒙平台上。最近,Taro 发布了 v4.0.0-beta.x 版本,支持使用 Taro 快速开发
    的头像 发表于 02-02 16:09 389次阅读
    使用 Taro <b class='flag-5'>开发</b><b class='flag-5'>鸿蒙</b>原生应用 —— 快速上手,<b class='flag-5'>鸿蒙</b>应用<b class='flag-5'>开发</b>指南

    鸿蒙ArkUI开发实战:eTS版【笑话app】

    制作一款笑话app,使用ArkUI
    的头像 发表于 03-25 16:04 193次阅读
    <b class='flag-5'>鸿蒙</b><b class='flag-5'>ArkUI</b><b class='flag-5'>开发</b>实战:eTS版【笑话app】