鸿蒙开发之图片选择器

一、使用

系统的图片选择器真的非常友好,这个绝对要赞一下。

pickPhotos() {
//初始化一个photopicker
let photoPicker = new picker.PhotoViewPicker()
   
//maxSelectNumber最多选择多少张(默认值为50,最大值为500)
//MIMEType 选择文件的类型
photoPicker.select({maxSelectNumber:9,MIMEType:picker.PhotoViewMIMETypes.IMAGE_TYPE}).then(val => {
      //通过val.photoUris就可以拿到图片的Uri数组了
      //val.photoUris
      
    }).catch(err => {
      Prompt.showToast({message:'获取图片失败'})
    })

  }

二、实现图片删除

长按图片,给图片添加一个抖动的动画。这里借助了z轴旋转动画实现。

import picker from '@ohos.file.picker'
import Prompt from '@system.prompt'

/*
 * 开发中动画实现上遇到一个问题不能停止动画的问题
 * 一开始想的是直接操作旋转的角度和z轴的值,但是发现有些gridItem不生效还会动
 * 群友提供了一个思路:
 * 在动画finish回调中不断的重置旋转的角度和z轴的值达到开启关闭动画
 * */
HarmonyOS开发中,实现图片的排列通常涉及UI组件管理和布局管理。你可以通过以下几个步骤来实现: 1. **引入布局文件**:在XML布局文件中,如`.hml`文件中,选择合适的容器控件,比如`Grid`、`RecycleView`或`LinearLayout`等,用于展示图片。 ```xml <com.harmoonyos.widget.Grid layout ...> <image-item src="@drawable/image1" /> <image-item src="@drawable/image2" /> <!-- 更多图片项 --> </com.harmoonyos.widget.Grid> ``` 2. **自定义组件**:创建`image-item`这样的自定义组件,可以包含图片以及相关的样式信息。如果是图片轮播或者瀑布流效果,可能会需要继承特定的视图组类并实现相关事件处理。 ```java class ImageItem extends View { private ImageView imageView; public ImageItem(Context context) { ... } // 设置图片源并加载 void setImage(String imageUrl) { imageView.setImageURI(Uri.parse(imageUrl)); } } ``` 3. **数据绑定**:将图片的列表数据传入布局,并在运行时动态设置每个`image-item`的图片源,这可以通过集合adapter来完成。 ```java List<String> imageUrls = ...; Grid grid = findViewById(R.id.grid); grid.setAdapter(new ImageAdapter(imageUrls, context)); ``` 4. **监听和调整**:如果需要响应用户的交互或者屏幕大小变化,可以添加相应的事件监听器来调整图片的显示顺序或布局。 ```java grid.setOnItemClickListener(new AdapterView.OnItemClickListener() {...}); grid.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener {...}); ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值