鸿蒙HarmonyOS-获取系统照片并解码渲染显示2(附更完整的Demo)

开发 OpenHarmony
文章由鸿蒙社区产出,想要了解更多内容请前往:51CTO和华为官方战略合作共建的鸿蒙技术社区https://harmonyos.51cto.com/#zz

[[374067]]

想了解更多内容,请访问:

51CTO和华为官方合作共建的鸿蒙技术社区

https://harmonyos.51cto.com/#zz

声明一下哦,本篇是接着我的上一篇文章——#2020征文-手机#获取系统照片并解码渲染显示(附完整demo) 原创 来写的。需要的可以先读读上一篇文件滴,本篇则是在上一篇代码基础上进一步修改而来。

说一下功能的升级(较上一版本):(ps:我也想搞分布式,可目前的现实不允许,还是等远程模拟器的多设备分布式联调能力开放吧)

1.没有图片会出现提示

2.相册中的所有照片都可显示,并且显示计数

3.应用随打开随刷新

不多说,先上demo跑起来的效果,如下两张图:第一张图是在手机远程模拟器中一张图片都没有时候的显示界面,第二张是自己打开远程模拟器的照相功能一顿乱点,照了N张之后的显示界面

完整的demo在附件中进行下载


老规矩先说升级的大概思路

1.采用TableLayout布局实现了所有照片的显示

2.添加两个Text用来显示无照片的提示信息和照片的计数信息

3.在onActive生命周期函数中添加方法实现实时刷新

1.采用TableLayout布局实现了所有照片的显示

1.1 在布局文件中添加TableLayout布局代码,需要注意的是:这里我外边套了一层ScrollView,这是为了在图片多的时候,TableLayout可以滑动

<ScrollView ohos:width="match_parent" 
                ohos:height="600vp" 
                ohos:left_padding="25vp" 
                > 
    <TableLayout 
        ohos:id="$+id:layout_id" 
        ohos:height="match_content" 
        ohos:width="match_parent" 
        > 
    </TableLayout> 
    </ScrollView> 
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.

 1.2 在java代码中获取到这个布局

 TableLayout img_layout;         
img_layout = (TableLayout)findComponentById(ResourceTable.Id_layout_id); 
img_layout.setColumnCount(3); 
  • 1.
  • 2.
  • 3.

 1.3 将新生成的图片放入布局中 

Image img = new Image(MainAbilitySlice.this); 
img.setId(mediaId); 
img.setHeight(300); 
img.setWidth(300); 
img.setMarginTop(20); 
img.setMarginLeft(20); 
img.setPixelMap(pixelMap); 
img.setScaleMode(Image.ScaleMode.ZOOM_CENTER); 
img_layout.addComponent(img); 
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.

 2.添加两个Text用来显示无照片的提示信息和照片的计数信息

2.1 首先在布局文件中加入两个text

<Text 
      ohos:id="$+id:text_pre_id" 
      ohos:width="match_parent" 
      ohos:height="match_parent" 
      ohos:text_alignment="center" 
      ohos:text_size="45fp" 
      ohos:text="Opening..."></Text> 
  <Text 
      ohos:id="$+id:text_id" 
      ohos:width="match_content" 
      ohos:height="match_content" 
      ohos:text_alignment="center" 
      ohos:text_size="20fp"></Text> 
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.

 2.2 在java中获得这两个text组件

Text pre_text,text; 
pre_text = (Text)findComponentById(ResourceTable.Id_text_pre_id); 
text = (Text)findComponentById(ResourceTable.Id_text_id); 
  • 1.
  • 2.
  • 3.

 2.3 利用能不能获取到图片来判断这两个text组件的显示逻辑

if(img_ids.size() > 0){ 
         pre_text.setVisibility(Component.HIDE); 
         text.setVisibility(Component.VISIBLE); 
         text.setText("照片数量:"+img_ids.size()); 
     }else
         pre_text.setVisibility(Component.VISIBLE); 
         pre_text.setText("No picture."); 
         text.setVisibility(Component.HIDE); 
     } 
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.

 3.在onActive生命周期函数中添加方法实现实时刷新

3.1 onActive生命周期函数介绍

  • Page会在进入INACTIVE状态后来到前台,然后系统调用此回调。Page在此之后进入ACTIVE状态,该状态是应用与用户交互的状态。所以当你把应用放到后台,打开照相机照相的时候,然后在打开此应用的时候就会调用该生命周期函数

3.2 在onActive函数中添加需要的调用

@Override 
 public void onActive() { 
     super.onActive(); 
     displayPic(); 
 } 
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.

 3.3 displayPic函数封装了整个展示图片的代码

public void displayPic(){ 
        img_layout.removeAllComponents(); 
        ArrayList<Integer> img_ids = new ArrayList<Integer>(); 
        DataAbilityHelper helper = DataAbilityHelper.creator(getContext()); 
        try { 
            ResultSet result = helper.query(AVStorage.Images.Media.EXTERNAL_DATA_ABILITY_URI, nullnull); 
            if(result == null){ 
                pre_text.setVisibility(Component.VISIBLE); 
            }else
                pre_text.setVisibility(Component.HIDE); 
            } 
            while(result != null && result.goToNextRow()){ 
                int mediaId = result.getInt(result.getColumnIndexForName(AVStorage.Images.Media.ID)); 
                Uri uri = Uri.appendEncodedPathToUri(AVStorage.Images.Media.EXTERNAL_DATA_ABILITY_URI,""+mediaId); 
                FileDescriptor filedesc = helper.openFile(uri,"r"); 
                ImageSource.DecodingOptions decodingOpts = new ImageSource.DecodingOptions(); 
                decodingOpts.desiredSize = new Size(300,300); 
                ImageSource imageSource = ImageSource.create(filedesc,null); 
                PixelMap pixelMap = imageSource.createThumbnailPixelmap(decodingOpts,true); 
                Image img = new Image(MainAbilitySlice.this); 
                img.setId(mediaId); 
                img.setHeight(300); 
                img.setWidth(300); 
                img.setMarginTop(20); 
                img.setMarginLeft(20); 
                img.setPixelMap(pixelMap); 
                img.setScaleMode(Image.ScaleMode.ZOOM_CENTER); 
                img_layout.addComponent(img); 
                System.out.println("xxx"+uri); 
                img_ids.add(mediaId); 
            } 
        }catch (DataAbilityRemoteException | FileNotFoundException e){ 
            e.printStackTrace(); 
        } 
        if(img_ids.size() > 0){ 
            pre_text.setVisibility(Component.HIDE); 
            text.setVisibility(Component.VISIBLE); 
            text.setText("照片数量:"+img_ids.size()); 
        }else
            pre_text.setVisibility(Component.VISIBLE); 
            pre_text.setText("No picture."); 
            text.setVisibility(Component.HIDE); 
        } 
    } 
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.
  • 35.
  • 36.
  • 37.
  • 38.
  • 39.
  • 40.
  • 41.
  • 42.
  • 43.
  • 44.

 这个demo目前来说,还算基本能看。。。有时间的我会继续尝试修改完善。

有兴趣的朋友可以关注一下

完整demo的源码见附件

©著作权归作者和HarmonyOS技术社区共同所有,如需转载,请注明出处,否则将追究法律责任

想了解更多内容,请访问:

51CTO和华为官方合作共建的鸿蒙技术社区

https://harmonyos.51cto.com/#zz

 

责任编辑:jianghua 来源: 鸿蒙社区
相关推荐

2021-01-04 10:03:28

鸿蒙手机app开发显示系统图片

2022-03-07 16:46:03

HarmonyOS鸿蒙操作系统

2022-06-29 13:59:40

家居应用鸿蒙

2022-02-28 15:52:07

canvasHarmonyOS鸿蒙

2021-05-28 09:52:00

鸿蒙HarmonyOS应用

2022-09-05 15:22:27

ArkUIets

2022-03-18 15:41:29

原子化服务HarmonyOS鸿蒙

2020-11-11 11:56:05

HarmonyOS

2021-05-19 08:41:11

鸿蒙HarmonyOS应用

2021-10-08 10:02:50

鸿蒙HarmonyOS应用

2018-02-05 08:25:14

LinuxDebian离线更新

2017-08-22 15:27:50

冷却系统数据中心

2021-05-17 14:37:02

鸿蒙HarmonyOS应用

2021-01-11 10:05:03

鸿蒙HarmonyOS鸿蒙3861

2021-06-06 17:50:41

微软Edge浏览器

2011-06-14 18:37:50

Flash

2014-07-10 10:09:11

JSON数据行转列

2011-07-28 14:45:03

iOS图像显示
点赞
收藏

51CTO技术栈公众号