HarmonyOS实战—点击更换随机图片 - HarmonyOS技术社区 - 电子技术论坛

兮动人

2021-08-13 10:59:03

HarmonyOS 鸿蒙系统鸿蒙OS

单击随机更换图片

点击按钮就会更换一张图片

实现案例：

新建项目：ImageSwitchApplication

思路分析：

准备好几张图片复制到 media 中
如果要获取text文本里面的汉字就可以使用资源管理器，但是现在不需要图片里的每个字节，要的是图片的整体，就不需要用资源管理器去读了，直接用ResourceTable来获取就行了
存储图片使用集合更方便，因为图片可能有很多张，数组还要确定长度，有点不方便，所以用集合
可以看到图片是int类型的，所以集合用 Integer
在 onClick 方法当中要用到 img 组件对象、还要创建的集合对象，所以要把这两者定为成员变量，onClick 方法才能使用

代码实现：

ability_main

<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout
xmlns:ohos="http://schemas.huawei.com/res/ohos"
ohos:height="match_parent"
ohos:width="match_parent"
ohos:alignment="center"
ohos:orientation="vertical">
<Image
ohos:id="$+id:img"
ohos:height="match_content"
ohos:width="match_content">
</Image>
<Button
ohos:id="$+id:but1"
ohos:height="match_content"
ohos:width="match_content"
ohos:text="点我"
ohos:text_size="150"
ohos:background_element="red"
>
</Button>
</DirectionalLayout>

复制代码

MainAbilitySlice

package com.xdr630.imageswitchapplication.slice;
import com.xdr630.imageswitchapplication.ResourceTable;
import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.components.Button;
import ohos.agp.components.Component;
import ohos.agp.components.Image;
import java.util.ArrayList;
import java.util.Random;
public class MainAbilitySlice extends AbilitySlice implements Component.ClickedListener {
ArrayList<Integer> list = new ArrayList<>();
Image img;
@Override
public void onStart(Intent intent) {
super.onStart(intent);
super.setUIContent(ResourceTable.Layout_ability_main);
//定义一个数组或者集合来存储所有图片
list.add(ResourceTable.Media_girl1);
list.add(ResourceTable.Media_girl2);
list.add(ResourceTable.Media_girl3);
list.add(ResourceTable.Media_girl4);
list.add(ResourceTable.Media_girl5);
list.add(ResourceTable.Media_girl6);
list.add(ResourceTable.Media_girl7);
list.add(ResourceTable.Media_girl8);
list.add(ResourceTable.Media_girl9);
//找到组件
img = (Image) findComponentById(ResourceTable.Id_img);
Button but1 = (Button) findComponentById(ResourceTable.Id_but1);
//给按钮绑定单击事件
but1.setClickedListener(this);
}
@Override
public void onActive() {
super.onActive();
}
@Override
public void onForeground(Intent intent) {
super.onForeground(intent);
}
@Override
public void onClick(Component component) {
//当按钮被点击之后，需要修改图片的内容
Random r = new Random();
int index = r.nextInt(list.size());
//通过随机索引，可以获取随机元素
int randomImg = list.get(index);
//把获取到的随机图片设置给Image组件就可以了
img.setImageAndDecodeBounds(randomImg);
}
}

复制代码

运行：
也可以进一步扩展：点击图片时就可以查看详细信息。

【本文正在参与“有奖征文 | HarmonyOS征文大赛”活动】https://bbs.elecfans.com/jishu_2098584_1_1.html

回帖高级模式

声明：本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人，不代表电子发烧友网立场。文章及其配图仅供工程师学习之用，如有内容图片侵权或者其他问题，请联系本站作侵删。侵权投诉

[文章]HarmonyOS实战—点击更换随机图片

回帖高级模式