鸿蒙应用开发图片编辑器练习与分享

鸿蒙时代
发布于 2021-4-13 09:53
浏览
1收藏

显示效果:

  鸿蒙应用开发图片编辑器练习与分享-鸿蒙开发者社区

点击“旋转”

  鸿蒙应用开发图片编辑器练习与分享-鸿蒙开发者社区

点击“剪裁”

  鸿蒙应用开发图片编辑器练习与分享-鸿蒙开发者社区

点击“缩放”

  鸿蒙应用开发图片编辑器练习与分享-鸿蒙开发者社区

点击“镜像”

  鸿蒙应用开发图片编辑器练习与分享-鸿蒙开发者社区

布局中的代码

<?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:orientation="vertical">
    <Text
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:layout_alignment="horizontal_center"
        ohos:text="蛟龙腾飞图像开发"
        ohos:text_size="80"
        ohos:top_margin="40vp"
        />
    <DirectionalLayout
        xmlns:ohos="http://schemas.huawei.com/res/ohos"
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:layout_alignment="horizontal_center"
        ohos:orientation="horizontal"
        ohos:top_margin="20vp">
        <Button
            ohos:id="$+id:jltfwhirl_image"
            ohos:height="match_content"
            ohos:width="match_content"
            ohos:background_element="$graphic:jltfbackground_button"
            ohos:padding="12vp"
            ohos:right_margin="5vp"
            ohos:text="旋转"
            ohos:text_size="20vp"
            ohos:top_margin="10vp">
        </Button>
        <Button
            ohos:id="$+id:jltfcrop_image"
            ohos:height="match_content"
            ohos:width="match_content"
            ohos:background_element="$graphic:jltfbackground_button"
            ohos:left_margin="5vp"
            ohos:padding="12vp"
            ohos:text="剪裁"
            ohos:text_size="20vp"
            ohos:top_margin="10vp">
        </Button>
        <Button
            ohos:id="$+id:jltfscale_image"
            ohos:height="match_content"
            ohos:width="match_content"
            ohos:background_element="$graphic:jltfbackground_button"
            ohos:left_margin="5vp"
            ohos:padding="12vp"
            ohos:text="缩放"
            ohos:text_size="20vp"
            ohos:top_margin="10vp">
        </Button>
        <Button
            ohos:id="$+id:jltfmirror_image"
            ohos:height="match_content"
            ohos:width="match_content"
            ohos:background_element="$graphic:jltfbackground_button"
            ohos:left_margin="5vp"
            ohos:padding="12vp"
            ohos:text="镜像"
            ohos:text_size="20vp"
            ohos:top_margin="10vp"/>
    </DirectionalLayout>
    <Image
        ohos:id="$+id:jltfimage"
        ohos:height="1200px"
        ohos:width="1024px"
        ohos:image_src="$media:shici1"
        ohos:layout_alignment="horizontal_center"
        ohos:top_margin="20vp">
    </Image>
</DirectionalLayout>

学习材料:

https://developer.huawei.com/consumer/cn/codelabsPortal/carddetails/HarmonyOS-Image-Operations

完整代码地址:

https://gitee.com/jltfcloudcn/jump_to/tree/master/tpbjq

分类
标签
已于2021-4-30 17:31:04修改
1
收藏 1
回复
举报
回复
    相关推荐