任何一種開發工具也不可能為開發者提供所有的元件，根據現有元件定義自己的元件也就成為必需。接下來的幾篇文章我們定義一個多層圓弧形進度條。本文是第一篇。

定義元件類

首先定義一個Component的派生類並簡單地定義幾個建構函式。

package com.components.cusomized;import ohos.agp.components.AttrSet;import ohos.agp.components.Component;import ohos.agp.render.Canvas;import ohos.agp.utils.Color;import ohos.app.Context;import ohos.hiviewdfx.HiLog;import ohos.hiviewdfx.HiLogLabel;import ohos.multimodalinput.event.TouchEvent;public class MultiRoundProgressBar extends Component {    // HiLogLabel    private static final HiLogLabel Label = new HiLogLabel(HiLog.LOG_APP, 0x00101, "MultiRoundProgressBar");    public MultiRoundProgressBar(Context context) {        super(context);     }    public MultiRoundProgressBar(Context context, AttrSet attrSet) {        super(context, attrSet);    }    public MultiRoundProgressBar(Context context, AttrSet attrSet, String styleName) {        super(context, attrSet, styleName);    }    public MultiRoundProgressBar(Context context, AttrSet attrSet, int resId) {        super(context, attrSet, resId);    }}

這個目前沒有任何功能，只是先佔一個地方。稍微需要注意一下的是它所屬的package為：com.components.cusomized。

使用自定義元件

可以像鴻蒙原生元件一樣使用自定義元件：

<?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:id="$+id:text_helloworld"        ohos:height="match_content"        ohos:width="match_content"        ohos:background_element="$graphic:background_ability_main"        ohos:layout_alignment="horizontal_center"        ohos:text="$string:HelloWorld"        ohos:text_size="50"        />    <com.components.cusomized.MultiRoundProgressBar        ohos:id="$+id:mrprogressId"        ohos:height="match_parent"        ohos:width="match_parent"        ohos:background_element="#00FF00"        /></DirectionalLayout>

程式碼第16行透過package+類名的方式使用自定義元件。

顯示效果

下圖中綠色部分就是自定義元件的表示區域。

下一篇文章我們繼續說明如何為自定義元件定義描畫動作。

作者著作介紹

《實戰Python設計模式》是作者去年3月份出版的技術書籍，該書利用Python 的標準GUI 工具包tkinter，透過可執行的示例對23 個設計模式逐個進行說明。這樣一方面可以使讀者瞭解真實的軟體開發工作中每個設計模式的運用場景和想要解決的問題；另一方面透過對這些問題的解決過程進行說明，讓讀者明白在編寫程式碼時如何判斷使用設計模式的利弊，併合理運用設計模式。

對設計模式感興趣而且希望隨學隨用的讀者透過本書可以快速跨越從理解到運用的門檻；希望學習Python GUI 程式設計的讀者可以將本書中的示例作為設計和開發的參考；使用Python 語言進行影象分析、資料處理工作的讀者可以直接以本書中的示例為基礎，迅速構建自己的系統架構。

覺得本文有幫助？請分享給更多人。