HarmonyOS学习路之开发篇—Java UI框架(动画开发)

这篇具有很好参考价值的文章主要介绍了HarmonyOS学习路之开发篇—Java UI框架(动画开发)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

动画开发

动画是组件的基础特性之一,精心设计的动画使UI变化更直观,有助于改进应用程序的外观并改善用户体验。Java UI框架提供了帧动画、数值动画和属性动画,并提供了将多个动画同时操作的动画集合。

帧动画

帧动画是利用视觉暂留现象,将一系列静止的图片按序播放,给用户产生动画的效果。

1. 在Project窗口,打开“entry > src > main > resources > base > media”,添加一系列图片至media目录下。

HarmonyOS学习路之开发篇—Java UI框架(动画开发)

2. 在graphic目录下,新建“animation_element.xml”文件,在XML文件中使用animation-list标签来配置图片资源,duration用来设置显示时长,单位为毫秒。oneshot表示是否只播放一次。

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:ohos="http://schemas.huawei.com/res/ohos"
                ohos:oneshot="false">
    <item ohos:element="$media:01" ohos:duration="100"/>
    <item ohos:element="$media:02" ohos:duration="100"/>
    <item ohos:element="$media:03" ohos:duration="100"/>
    <item ohos:element="$media:04" ohos:duration="100"/>
    <item ohos:element="$media:05" ohos:duration="100"/>
    <item ohos:element="$media:06" ohos:duration="100"/>
    <item ohos:element="$media:07" ohos:duration="100"/>
    <item ohos:element="$media:08" ohos:duration="100"/>
    <item ohos:element="$media:09" ohos:duration="100"/>
    <item ohos:element="$media:10" ohos:duration="100"/>
    <item ohos:element="$media:11" ohos:duration="100"/>
    <item ohos:element="$media:12" ohos:duration="100"/>
</animation-list>

3. 在MainAbilitySlice.java中实现动画播放的相关功能。

import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.components.ComponentContainer;
import ohos.agp.components.DirectionalLayout;
import ohos.agp.components.Image;
import ohos.agp.components.element.FrameAnimationElement;

public class MainAbilitySlice extends AbilitySlice {
    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        //加载动画资源,生成动画对象。
        FrameAnimationElement frameAnimationElement = new FrameAnimationElement(getContext(), ResourceTable.Graphic_animation_element);
        //创建播放动画的组件
        Image image = new Image(getContext());
        image.setLayoutConfig(new ComponentContainer.LayoutConfig(500, 500));
        image.setBackground(frameAnimationElement);
        DirectionalLayout directionalLayout = new DirectionalLayout(getContext());
        directionalLayout.addComponent(image);
        super.setUIContent(directionalLayout);
        //开始播放动画
        frameAnimationElement.start();
    }
}

动画效果如图所示:

HarmonyOS学习路之开发篇—Java UI框架(动画开发)

数值动画

AnimatorValue数值从0到1变化,本身与Component无关。开发者可以设置0到1变化过程的属性,例如:时长、变化曲线、重复次数等,并通过值的变化改变组件的属性,实现组件的动画效果。

  • Java代码方式

MainAbilitySlice.java的示例代码如下:

import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.animation.Animator;
import ohos.agp.animation.AnimatorValue;
import ohos.agp.components.ComponentContainer;
import ohos.agp.components.DirectionalLayout;
import ohos.agp.components.Image;

public class MainAbilitySlice extends AbilitySlice {
    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        //创建播放动画的组件
        Image image = new Image(getContext());
        image.setPixelMap(ResourceTable.Media_icon);
        image.setLayoutConfig(new ComponentContainer.LayoutConfig(200, 200));
        DirectionalLayout layout = new DirectionalLayout(getContext());
        layout.setLayoutConfig(new ComponentContainer.LayoutConfig(
                ComponentContainer.LayoutConfig.MATCH_PARENT,
                ComponentContainer.LayoutConfig.MATCH_PARENT
        ));
        layout.addComponent(image);
        super.setUIContent(layout);
        //创建数值动画对象
        AnimatorValue animatorValue = new AnimatorValue();
        //动画时长
        animatorValue.setDuration(3000);
        //播放前的延迟时间
        animatorValue.setDelay(1000);
        //循环次数
        animatorValue.setLoopedCount(AnimatorValue.INFINITE);
        //动画的播放类型
        animatorValue.setCurveType(Animator.CurveType.BOUNCE);
        //设置动画过程
        animatorValue.setValueUpdateListener(new AnimatorValue.ValueUpdateListener() {
            @Override
            public void onUpdate(AnimatorValue animatorValue, float value) {
                image.setContentPosition((int) (800 * value), image.getContentPositionY());
            }
        });
        //开始启动动画
        animatorValue.start();
    }
}
  • XML方式

在resources/base/animation目录下创建名为“animator_value.xml”XML文件。目前XML方式只支持delay和duration属性。

animator_value.xml的示例代码如下:

<?xml version="1.0" encoding="UTF-8" ?>
<animator xmlns:ohos="http://schemas.huawei.com/res/ohos"
          ohos:delay="1000"
          ohos:duration="3000"/>

MainAbilitySlice.java的示例代码如下:

import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.animation.Animator;
import ohos.agp.animation.AnimatorProperty;
import ohos.agp.animation.AnimatorScatter;
import ohos.agp.animation.AnimatorValue;
import ohos.agp.components.Component;
import ohos.agp.components.ComponentContainer;
import ohos.agp.components.DirectionalLayout;
import ohos.agp.components.Image;

public class MainAbilitySlice extends AbilitySlice {
    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        //创建播放动画的组件
        Image image = new Image(getContext());
        image.setPixelMap(ResourceTable.Media_icon);
        image.setLayoutConfig(new ComponentContainer.LayoutConfig(200, 200));
        DirectionalLayout layout = new DirectionalLayout(getContext());
        layout.setLayoutConfig(new ComponentContainer.LayoutConfig(
                ComponentContainer.LayoutConfig.MATCH_PARENT,
                ComponentContainer.LayoutConfig.MATCH_PARENT
        ));
        layout.addComponent(image);
        super.setUIContent(layout);
        //创建数值动画对象
        AnimatorScatter scatter = AnimatorScatter.getInstance(getContext());
        Animator animator = scatter.parse(ResourceTable.Animation_animator_value);
        if (animator instanceof AnimatorValue) {
            AnimatorValue animatorValue = (AnimatorValue) animator;
            //循环次数
            animatorValue.setLoopedCount(AnimatorValue.INFINITE);
            //动画的播放类型
            animatorValue.setCurveType(Animator.CurveType.BOUNCE);
            //设置动画过程
            animatorValue.setValueUpdateListener(new AnimatorValue.ValueUpdateListener() {
                @Override
                public void onUpdate(AnimatorValue animatorValue, float value) {
                    image.setContentPosition((int) (800 * value), image.getContentPositionY());
                }
            });
            //开始启动动画
            animatorValue.start();
        }
    }
}

动画效果如图所示:

HarmonyOS学习路之开发篇—Java UI框架(动画开发)

属性动画

为Component的属性设置动画是常见的需求,Java UI框架可以为Component设置某个属性或多个属性的动画。

  • Java方式

MainAbilitySlice.java的示例代码如下

import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.animation.Animator;
import ohos.agp.animation.AnimatorProperty;
import ohos.agp.animation.AnimatorValue;
import ohos.agp.components.Component;
import ohos.agp.components.ComponentContainer;
import ohos.agp.components.DirectionalLayout;
import ohos.agp.components.Image;

public class MainAbilitySlice extends AbilitySlice {
    private boolean started = false;

    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        //创建播放动画的组件
        Image image = new Image(getContext());
        image.setPixelMap(ResourceTable.Media_icon);
        image.setLayoutConfig(new ComponentContainer.LayoutConfig(200, 200));
        DirectionalLayout layout = new DirectionalLayout(getContext());
        layout.setLayoutConfig(new ComponentContainer.LayoutConfig(
                ComponentContainer.LayoutConfig.MATCH_PARENT,
                ComponentContainer.LayoutConfig.MATCH_PARENT
        ));
        layout.addComponent(image);
        super.setUIContent(layout);
        //创建属性动画对象
        AnimatorProperty animatorProperty = new AnimatorProperty();
        animatorProperty.setTarget(image);
        animatorProperty
                //x轴从100移动到800位置
                .moveFromX(100).moveToX(800)
                //透明度从0.5变化到1.0
                .alphaFrom(0.5f).alpha(1.0f)
                //旋转720度
                .rotate(720)
                //时长3秒
                .setDuration(3000)
                //延迟1秒
                .setDelay(1000)
                //无限循环
                .setLoopedCount(AnimatorValue.INFINITE)
                //反弹力效果
                .setCurveType(Animator.CurveType.BOUNCE);
        //点击图片开始/停止动画
        image.setClickedListener(new Component.ClickedListener() {
            @Override
            public void onClick(Component component) {
                if (!started) {
                    //开始动画
                    animatorProperty.start();
                } else {
                    //停止动画
                    animatorProperty.stop();
                }
                started = !started;
            }
        });
    }
}
  • XML方式

在resources/base/animation文件夹下创建名为“animator_property.xml”的XML文件。目前XML方式只支持delay和duration属性。

animator_property.xml的示例代码如下:

<?xml version="1.0" encoding="UTF-8" ?>
<animatorProperty xmlns:ohos="http://schemas.huawei.com/res/ohos"
                  ohos:delay="1000"
                  ohos:duration="3000"/>

MainAbilitySlice.java的示例代码如下:

import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.animation.Animator;
import ohos.agp.animation.AnimatorProperty;
import ohos.agp.animation.AnimatorScatter;
import ohos.agp.animation.AnimatorValue;
import ohos.agp.components.Component;
import ohos.agp.components.ComponentContainer;
import ohos.agp.components.DirectionalLayout;
import ohos.agp.components.Image;

public class MainAbilitySlice extends AbilitySlice {
    private boolean started = false;

    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        //创建播放动画的组件
        Image image = new Image(getContext());
        image.setPixelMap(ResourceTable.Media_icon);
        image.setLayoutConfig(new ComponentContainer.LayoutConfig(200, 200));
        DirectionalLayout layout = new DirectionalLayout(getContext());
        layout.setLayoutConfig(new ComponentContainer.LayoutConfig(
                ComponentContainer.LayoutConfig.MATCH_PARENT,
                ComponentContainer.LayoutConfig.MATCH_PARENT
        ));
        layout.addComponent(image);
        super.setUIContent(layout);
        //创建属性动画对象
        AnimatorScatter scatter = AnimatorScatter.getInstance(getContext());
        Animator animator = scatter.parse(ResourceTable.Animation_animator_property);
        if (animator instanceof AnimatorProperty) {
            AnimatorProperty animatorProperty = (AnimatorProperty) animator;
            animatorProperty.setTarget(image);
            animatorProperty
                    //x轴从100移动到800位置
                    .moveFromX(100).moveToX(800)
                    //透明度从0.5变化到1.0
                    .alphaFrom(0.5f).alpha(1.0f)
                    //旋转720度
                    .rotate(720)
                    //无限循环
                    .setLoopedCount(AnimatorValue.INFINITE)
                    //反弹力效果
                    .setCurveType(Animator.CurveType.BOUNCE);
            //点击图片开始/停止动画
            image.setClickedListener(new Component.ClickedListener() {
                @Override
                public void onClick(Component component) {
                    if (!started) {
                        //开始动画
                        animatorProperty.start();
                    } else {
                        //停止动画
                        animatorProperty.stop();
                    }
                    started = !started;
                }
            });
        }
    }
}

点击图片开始动画,效果如图所示:

HarmonyOS学习路之开发篇—Java UI框架(动画开发)

动画集合

如果需要使用一个组合动画,可以把多个动画对象进行组合,并添加到使用AnimatorGroup中。AnimatorGroup提供了两个方法:runSerially() 和 runParallel(),分别表示动画按顺序开始和动画同时开始。

说明:

动画集合暂不支持使用XML方式。

多个动画同时开始

同时执行动画1和动画2。

  • 动画1:沿x轴从100移动到800位置。
  • 动画2:沿y轴从100移动到800位置。

MainAbilitySlice.java的示例代码如下:

import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.animation.Animator;
import ohos.agp.animation.AnimatorGroup;
import ohos.agp.animation.AnimatorProperty;
import ohos.agp.components.Component;
import ohos.agp.components.ComponentContainer;
import ohos.agp.components.DirectionalLayout;
import ohos.agp.components.Image;

public class MainAbilitySlice extends AbilitySlice {
    private boolean started =false;

    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        //创建播放动画的组件
        Image image = new Image(getContext());
        image.setPixelMap(ResourceTable.Media_icon);
        image.setLayoutConfig(new ComponentContainer.LayoutConfig(200, 200));
        DirectionalLayout layout = new DirectionalLayout(getContext());
        layout.setLayoutConfig(new ComponentContainer.LayoutConfig(
                ComponentContainer.LayoutConfig.MATCH_PARENT,
                ComponentContainer.LayoutConfig.MATCH_PARENT
        ));
        layout.addComponent(image);
        super.setUIContent(layout);
        //创建动画组对象
        AnimatorGroup animatorGroup = new AnimatorGroup();
        //动画1 - 沿x轴从100移动到800位置
        AnimatorProperty action1 = new AnimatorProperty();
        action1.setTarget(image);
        action1.moveFromX(0).moveToX(800);
        //动画2 - 沿y轴从100移动到800位置
        AnimatorProperty action2 = new AnimatorProperty();
        action2.setTarget(image);
        action2.moveFromY(0).moveToY(800);
        //同时执行动画1和动画2
        animatorGroup.runParallel(action1, action2);
        //无限循环
        animatorGroup.setLoopedCount(Animator.INFINITE);
        //时长
        animatorGroup.setDuration(1500);
        //点击图片开始/停止动画
        image.setClickedListener(new Component.ClickedListener() {
            @Override
            public void onClick(Component component) {
                if (!started) {
                    //启动动画组
                    animatorGroup.start();
                } else {
                    //停止动画组
                    animatorGroup.stop();
                }
                started = !started;
            }
        });
    }
}

点击图片开始动画,多个动画同时开始的效果图如下:

HarmonyOS学习路之开发篇—Java UI框架(动画开发)

多个动画按顺序逐个执行

先执行动画1,然后执行动画2。

  • 动画1:沿x轴从100移动到800位置。
  • 动画2:沿y轴从100移动到800位置。

MainAbilitySlice.java的示例代码如下:

import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.animation.Animator;
import ohos.agp.animation.AnimatorGroup;
import ohos.agp.animation.AnimatorProperty;
import ohos.agp.components.Component;
import ohos.agp.components.ComponentContainer;
import ohos.agp.components.DirectionalLayout;
import ohos.agp.components.Image;

public class MainAbilitySlice extends AbilitySlice {
    private boolean started =false;

    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        //创建播放动画的组件
        Image image = new Image(getContext());
        image.setPixelMap(ResourceTable.Media_icon);
        image.setLayoutConfig(new ComponentContainer.LayoutConfig(200, 200));
        DirectionalLayout layout = new DirectionalLayout(getContext());
        layout.setLayoutConfig(new ComponentContainer.LayoutConfig(
                ComponentContainer.LayoutConfig.MATCH_PARENT,
                ComponentContainer.LayoutConfig.MATCH_PARENT
        ));
        layout.addComponent(image);
        super.setUIContent(layout);
        //创建动画组对象
        AnimatorGroup animatorGroup = new AnimatorGroup();
        //动画1 - 沿x轴从100移动到800位置
        AnimatorProperty action1 = new AnimatorProperty();
        action1.setTarget(image);
        action1.moveFromX(0).moveToX(800);
        //动画2 - 沿y轴从100移动到800位置
        AnimatorProperty action2 = new AnimatorProperty();
        action2.setTarget(image);
        action2.moveFromY(0).moveToY(800);
        //先动画1后动画2
        animatorGroup.runSerially(action1, action2);
        //无限循环
        animatorGroup.setLoopedCount(Animator.INFINITE);
        //时长
        animatorGroup.setDuration(1500);
        //点击图片开始/停止动画
        image.setClickedListener(new Component.ClickedListener() {
            @Override
            public void onClick(Component component) {
                if (!started) {
                    //启动动画组
                    animatorGroup.start();
                } else {
                    //停止动画组
                    animatorGroup.stop();
                }
                started = !started;
            }
        });
    }
}

点击图片开始动画,多个动画按顺序逐个执行的效果图如下:

HarmonyOS学习路之开发篇—Java UI框架(动画开发)

多个动画顺序执行和同时执行并存

为了更加灵活处理多个动画的播放顺序,例如一些动画顺序播放、一些动画同时播放,Java UI框架提供了更方便的动画Builder接口。

先同时执行动画1和动画2,然后同时执行动画3和动画4。

  • 动画1:沿x轴从100移动到800位置。
  • 动画2:沿y轴从100移动到800位置。
  • 动画3:沿y轴从0.3放大到1.0。
  • 动画4:沿x轴从0.3放大到1.0。

MainAbilitySlice.java的示例代码如下:

import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.animation.Animator;
import ohos.agp.animation.AnimatorGroup;
import ohos.agp.animation.AnimatorProperty;
import ohos.agp.components.Component;
import ohos.agp.components.ComponentContainer;
import ohos.agp.components.DirectionalLayout;
import ohos.agp.components.Image;

public class MainAbilitySlice extends AbilitySlice {
    private boolean started =false;

    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        //创建播放动画的组件
        Image image = new Image(getContext());
        image.setPixelMap(ResourceTable.Media_icon);
        image.setLayoutConfig(new ComponentContainer.LayoutConfig(200, 200));
        DirectionalLayout layout = new DirectionalLayout(getContext());
        layout.setLayoutConfig(new ComponentContainer.LayoutConfig(
                ComponentContainer.LayoutConfig.MATCH_PARENT,
                ComponentContainer.LayoutConfig.MATCH_PARENT
        ));
        layout.addComponent(image);
        super.setUIContent(layout);
        //创建动画组对象
        AnimatorGroup animatorGroup = new AnimatorGroup();
        //动画1 - 沿x轴从100移动到800位置
        AnimatorProperty action1 = new AnimatorProperty();
        action1.setTarget(image);
        action1.moveFromX(0).moveToX(800);
        //动画2 - 沿y轴从100移动到800位置
        AnimatorProperty action2 = new AnimatorProperty();
        action2.setTarget(image);
        action2.moveFromY(0).moveToY(800);
        //动画3 - 沿y轴从0.3放大到1.0
        AnimatorProperty action3 = new AnimatorProperty();
        action3.setTarget(image);
        action3.scaleYFrom(0.3f).scaleY(1.0f);
        //动画4 - 沿x轴从0.3放大到1.0
        AnimatorProperty action4 = new AnimatorProperty();
        action4.setTarget(image);
        action4.scaleXFrom(0.3f).scaleX(1.0f);

        //先同时执行动画1和动画2,然后同时执行动画3和动画4
        AnimatorGroup.Builder builder = animatorGroup.build();
        builder.addAnimators(action1,action2).addAnimators(action3,action4);
        //无限循环
        animatorGroup.setLoopedCount(Animator.INFINITE);
        //时长
        animatorGroup.setDuration(1500);
        //点击图片开始/停止动画
        image.setClickedListener(new Component.ClickedListener() {
            @Override
            public void onClick(Component component) {
                if (!started) {
                    //启动动画组
                    animatorGroup.start();
                } else {
                    //停止动画组
                    animatorGroup.stop();
                }
                started = !started;
            }
        });
    }
}

点击图片开始动画,动画集合的效果图如下:

HarmonyOS学习路之开发篇—Java UI框架(动画开发)文章来源地址https://www.toymoban.com/news/detail-493495.html

到了这里,关于HarmonyOS学习路之开发篇—Java UI框架(动画开发)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • HarmonyOS学习路之方舟开发框架—方舟开发框架(ArkUI)概述

    方舟开发框架(简称ArkUI)为HarmonyOS应用的UI开发提供了完整的基础设施,包括简洁的UI语法、丰富的UI功能(组件、布局、动画以及交互事件),以及实时界面预览工具等,可以支持开发者进行可视化界面开发。 UI: 即用户界面。开发者可以将应用的用户界面设计为多个功能

    2024年02月16日
    浏览(49)
  • HarmonyOS学习路之方舟开发框架—学习ArkTS语言(基本语法 二)

    在ArkUI中,UI显示的内容均为组件,由框架直接提供的称为系统组件,由开发者定义的称为自定义组件。在进行 UI 界面开发时,通常不是简单的将系统组件进行组合使用,而是需要考虑代码可复用性、业务逻辑与UI分离,后续版本演进等因素。因此,将UI和部分业务逻辑封装成

    2024年02月04日
    浏览(54)
  • HarmonyOS学习路之方舟开发框架—学习ArkTS语言(基本语法 四)

    当创建了自定义组件,并想对该组件添加特定功能时,例如在自定义组件中添加一个点击跳转操作。若直接在组件内嵌入事件方法,将会导致所有引入该自定义组件的地方均增加了该功能。为解决此问题,ArkUI引入了@BuilderParam装饰器,@BuilderParam用来装饰指向@Builder方法的变量

    2024年02月17日
    浏览(53)
  • HarmonyOS学习路之方舟开发框架—学习ArkTS语言(基本语法 三)

    在开始之前,先明确自定义组件和页面的关系: 自定义组件: @Component 装饰的 UI 单元,可以组合多个系统组件实现 UI 的复用。 页面:即应用的 UI 页面。可以由一个或者多个自定义组件组成, @Entry 装饰的自定义组件为页面的入口组件,即页面的根节点,一个页面有且仅能有

    2024年02月16日
    浏览(63)
  • HarmonyOS学习路之方舟开发框架—学习ArkTS语言(基本语法 五)

    如果每个组件的样式都需要单独设置,在开发过程中会出现大量代码在进行重复样式设置,虽然可以复制粘贴,但为了代码简洁性和后续方便维护,我们推出了可以提炼公共样式进行复用的装饰器@Styles。 @Styles装饰器可以将多条样式设置提炼成一个方法,直接在组件声明的位

    2024年02月17日
    浏览(56)
  • HarmonyOS学习路之方舟开发框架—学习ArkTS语言(基本语法 一)

    ArkTS是HarmonyOS优选的主力应用开发语言。ArkTS围绕应用开发在 TypeScript (简称 TS )生态基础上做了进一步扩展,继承了 TS 的所有特性,是 TS 的超集。因此,在学习 ArkTS 语言之前,建议开发者具备 TS 语言开发能力。 当前, ArkTS 在 TS 的基础上主要扩展了如下能力: 基本语法:

    2024年02月16日
    浏览(70)
  • HarmonyOS学习路之方舟开发框架—学习ArkTS语言(状态管理 六)

    AppStorage是应用全局的UI状态存储,是和应用的进程绑定的,由UI框架在应用程序启动时创建,为应用程序UI状态属性提供中央存储。 和LocalStorage不同的是,LocalStorage是页面级的,通常应用于页面内的数据共享。而对于AppStorage,是应用级的全局状态共享。 AppStorage是在应用启动

    2024年02月20日
    浏览(54)
  • HarmonyOS学习路之方舟开发框架—学习ArkTS语言(状态管理 二)

    @Prop装饰的变量可以和父组件建立单向的同步关系。@Prop装饰的变量是可变的,但是变化不会同步回其父组件。 @Prop装饰的变量和父组件建立单向的同步关系: @Prop变量允许在本地修改,但修改后的变化不会同步回父组件。 当父组件中的数据源更改时,与之相关的@Prop装饰的变

    2024年02月14日
    浏览(48)
  • HarmonyOS鸿蒙基于Java开发: Java UI 动画开发指导

    目录 帧动画 数值动画 属性动画 动画集合 多个动画同时开始 多个动画按顺序逐个执行 多个动画顺序执行和同时执行并存 动画是组件的基础特性之一,精心设计的动画使UI变化更直观,有助于改进应用程序的外观并改善用户体验。

    2024年02月21日
    浏览(50)
  • HarmonyOS学习路之开发篇—流转

    随着全场景多设备生活方式的不断深入,用户拥有的设备越来越多,每个设备都能在适合的场景下提供良好的体验,例如:手表可以提供及时的信息查看能力,电视可以带来沉浸的观影体验。但是,每个设备也有使用场景的局限,例如:在电视上输入文本相对手机来说是非常

    2024年02月15日
    浏览(46)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包