HarmonyOS鸿蒙Next中通过graphic xml设置圆环问题

HarmonyOS鸿蒙Next中通过graphic xml设置圆环问题 各位老板好！在鸿蒙里，通过设置 graphic xml的方式设置自定义背景图的时候，怎样设置圆环？包括 圆环的颜色、环的宽度 等等，能否提供一个例子？

6 回复

cke_308.png

更多关于HarmonyOS鸿蒙Next中通过graphic xml设置圆环问题的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


感谢老板！

<?xml version="1.0" encoding="UTF-8"?>
<shape
    xmlns:ohos="http://schemas.huawei.com/res/ohos"
    ohos:shape="oval">

    <!-- 圆环颜色和宽度-->
    <stroke
        ohos:width="10vp"
        ohos:color="$color:color_1"/>
    <!--  半径，形状为oval时可以不设置  -->
    <corners ohos:radius="20vp"/>
</shape>

欢迎开发小伙伴们进来帮帮楼主

在HarmonyOS鸿蒙Next中，通过graphic XML设置圆环，可以使用<shape>标签定义图形，结合<solid>、<stroke>等属性实现。以下是一个示例代码：

<shape xmlns:ohos="http://schemas.huawei.com/res/ohos"
    ohos:shape="ring">
    <solid ohos:color="#FF0000"/>
    <stroke ohos:width="10" ohos:color="#00FF00"/>
    <size ohos:width="200" ohos:height="200"/>
    <corners ohos:radius="100"/>
</shape>
  • ohos:shape="ring"：指定形状为圆环。
  • <solid ohos:color="#FF0000"/>：设置圆环填充颜色为红色。
  • <stroke ohos:width="10" ohos:color="#00FF00"/>：设置圆环边框宽度为10，颜色为绿色。
  • <size ohos:width="200" ohos:height="200"/>：设置圆环的宽高为200。
  • <corners ohos:radius="100"/>：设置圆环的半径为100。

通过以上配置，可以在鸿蒙Next中实现一个圆环图形。

在HarmonyOS鸿蒙Next中，通过graphic XML设置圆环，可以使用<shape>标签定义形状，结合<solid>和<stroke>属性实现。例如，要绘制一个红色圆环，可以这样写：

<shape xmlns:ohos="http://schemas.huawei.com/res/ohos"
    ohos:shape="ring">
    <solid ohos:color="#FF0000"/>
    <stroke ohos:width="5" ohos:color="#000000"/>
</shape>

其中，ohos:shape="ring"表示圆环，<solid>设置填充颜色，<stroke>定义边框宽度和颜色。

回到顶部