HarmonyOS鴻蒙基本控件的實(shí)現(xiàn)

更新時(shí)間：2020年09月11日 16:39:59 作者：鴻蒙技術(shù)社區(qū)

這篇文章主要介紹了HarmonyOS應(yīng) 基本控件的實(shí)現(xiàn)，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧

感謝關(guān)注HarmonyOS，為了便于大家學(xué)習(xí)特將鴻蒙2.0基礎(chǔ)教學(xué)內(nèi)容整理如下：

1、HarmonyOS應(yīng)用開發(fā)—視頻播放
https://developer.huawei.com/consumer/cn/codelab/HarmonyOS-hap1/index.html#0

2、HarmonyOS應(yīng)用開發(fā)—基本控件
https://developer.huawei.com/consumer/cn/codelab/HarmonyOS-hap2/index.html#0

3、HarmonyOS應(yīng)用開發(fā)—UI開發(fā)與預(yù)覽
https://developer.huawei.com/consumer/cn/codelab/HarmonyOS-ui/index.html#0

4、HarmonyOS應(yīng)用開發(fā)—設(shè)備虛擬化特性開發(fā)
https://developer.huawei.com/consumer/cn/codelab/HarmonyOS-screenhardware/index.html#0

5、HarmonyOS應(yīng)用開發(fā)—HelloWorld應(yīng)用開發(fā)E2E體驗(yàn)
https://developer.huawei.com/consumer/cn/codelab/HarmonyOS-HelloWorld/index.html#0

6、HarmonyOS應(yīng)用開發(fā)—有界面元程序交互
https://developer.huawei.com/consumer/cn/codelab/HarmonyOS-hap6/index.html#0

7、HarmonyOS應(yīng)用開發(fā)-分布式任務(wù)調(diào)度
https://developer.huawei.com/consumer/cn/codelab/HarmonyOS-hap5/index.html#0

8、HarmonyOS應(yīng)用開發(fā)—剪切板
https://developer.huawei.com/consumer/cn/codelab/HarmonyOS-hap4/index.html#0

9、HarmonyOS應(yīng)用開發(fā)—應(yīng)用偏好數(shù)據(jù)讀寫
https://developer.huawei.com/consumer/cn/codelab/HarmonyOS-hap3/index.html#0

以下為HarmonyOS應(yīng)用開發(fā)—基本控件節(jié)選部分，如想進(jìn)一步了解，請(qǐng)點(diǎn)擊：HarmonyOS應(yīng)用開發(fā)—基本控件

HarmonyOS應(yīng)用開發(fā)-基本控件

1、介紹

您將建立什么

在這個(gè)Codelab中，你將創(chuàng)建Demo Project，并將Demo編譯成Hap，此示例應(yīng)用程序展示了如何使用輕量級(jí)偏好數(shù)據(jù)庫。
您將會(huì)學(xué)到什么

如何創(chuàng)建一個(gè)HarmonyOS Demo Project
如何構(gòu)建一個(gè)Hap并且將其部署到智慧屏真機(jī)
通過此示例應(yīng)用體驗(yàn)如何使用輕量級(jí)偏好數(shù)據(jù)庫

2. 您需要什么

硬件要求

操作系統(tǒng)：Windows10 64位
內(nèi)存：8G及以上。
硬盤：100G及以上。
分辨率：1280*800及以上

軟件要求

DevEco Studio：需手動(dòng)下載安裝，詳細(xì)步驟請(qǐng)參考《DevEco Studio使用指南》2.1.2
JDK：DevEco Studio自動(dòng)安裝。
Node.js：請(qǐng)手動(dòng)下載安裝，詳細(xì)步驟請(qǐng)參考《DevEco Studio使用指南》2.1.3 下載和安裝Node.js。
HarmonyOS SDK：待DevEco Studio安裝完成后，利用DevEco Studio來加載HarmonyOS SDK。詳細(xì)步驟請(qǐng)參考《DevEco Studio使用指南》2.1.6 加載HarmonyOS SDK。
Maven庫依賴包：如需手動(dòng)拷貝和配置，詳細(xì)步驟請(qǐng)參考《DevEco Studio使用指南》2.3 離線方式配置Maven庫。

需要的知識(shí)點(diǎn)

Java基礎(chǔ)開發(fā)能力。

3. 能力接入準(zhǔn)備

實(shí)現(xiàn)HarmonyOS應(yīng)用開發(fā)，需要完成以下準(zhǔn)備工作：

環(huán)境準(zhǔn)備。
環(huán)境搭建。
創(chuàng)建項(xiàng)目
申請(qǐng)調(diào)試證書
應(yīng)用開發(fā)

具體操作，請(qǐng)按照《DevEco Studio使用指南》中詳細(xì)說明來完成。

4. 代碼片段

1. 布局：

布局代碼：

LayoutConfig config = new LayoutConfig(LayoutConfig.MATCH_PARENT, LayoutConfig.MATCH_PARENT);
myLayout.setLayoutConfig(config);
myLayout.setOrientation(Component.VERTICAL);
ShapeElement element = new ShapeElement();
element.setRgbColor(new RgbColor(255, 255, 255));
myLayout.setBackground(element);
log = createText("日志信息");
myLayout.addComponent(log);
writeBtn = createBtn("寫入preferences數(shù)據(jù)", new RgbColor(0, 0, 255), 1002);
readBtn = createBtn("讀取preferences數(shù)據(jù)", new RgbColor(0, 0, 255), 1003);
addObserver = createBtn("注冊(cè)觀察者", new RgbColor(255, 0, 0), 1004);

private Text createText(String title) {
Text text = new Text(this);
DirectionalLayout.LayoutConfig config = new DirectionalLayout.LayoutConfig(DirectionalLayout.LayoutConfig.MATCH_CONTENT, DirectionalLayout.LayoutConfig.MATCH_CONTENT);
text.setLayoutConfig(config);
text.setText(title);
text.setTextSize(48);
text.setTextColor(new Color(0xFF0000FF));
return text;
}

private Button createBtn(String title, RgbColor color, int id) {
Button btn = new Button(this);
LayoutConfig configBtn = new LayoutConfig(500, 100);
configBtn.topMargin = 30;
btn.setLayoutConfig(configBtn);
btn.setText(title);
btn.setId(id);
btn.setTextSize(48);
btn.setTextColor(new Color(0xFFFFFFFF));
ShapeElement elementBtn = new ShapeElement();
elementBtn.setRgbColor(color);
elementBtn.setCornerRadius(12);
btn.setBackground(elementBtn);
myLayout.addComponent(btn);
return btn;
}

2. Preferences使用：

Preferences初始化

private void initPreferences() {
DatabaseHelper databaseHelper = new DatabaseHelper(this);
String fileName = "user_info";
preferences = databaseHelper.getPreferences(fileName);
}

寫文件：

preferences.putInt("age", Integer.parseInt(age.getText()));
preferences.putString("name", name.getText());
preferences.flushSync();

讀文件：

int age = preferences.getInt("age", 0);
String name = preferences.getString("name", "");
ToastDialog toastDialog = new ToastDialog(PreferencesAbilitySlice.this);
toastDialog.setText("read user data frome preferences name:" + name + ", age:" + age);
toastDialog.show();

觀察者：

注冊(cè)：

counter = new PreferencesChangeCounter();
preferences.registerObserver(counter);

private class PreferencesChangeCounter implements Preferences.PreferencesObserver {
 @Override
 public void onChange(Preferences preferences, String key) {
  if ("name".equals(key)) {
   String name = preferences.getString("name", "");
   log.setText("user data name is edit:" + name);
  }
  if ("age".equals(key)) {
   int age = preferences.getInt("age", 0);
   log.setText("user data age is edit:" + age);
  }
 }
}

刪除：

preferences.unregisterObserver(counter);

3. 響應(yīng)遙控器點(diǎn)擊

在zh-CN.json文件中寫入：

private void addFocusChangedListener(Component view) {
 view.setFocusChangedListener(new Component.FocusChangedListener() {
  @Override
  public void onFocusChange(Component component, boolean b) {
   ShapeElement shapeElement = (ShapeElement) view.getBackgroundElement();
   if (b) {
    shapeElement.setStroke(10, new RgbColor(0, 0, 0));
    focusView = view;
   } else {
    shapeElement.setStroke(0, new RgbColor(0, 0, 0));
   }
  }
 });
}

@Override
public boolean onKeyUp(int keyCode, KeyEvent keyEvent) {
 switch (keyCode) {
  case KeyEvent.KEY_DPAD_CENTER:
  case KeyEvent.KEY_ENTER:
   if(focusView == writeBtn) {
    
    preferences.putInt("age", index++);
    preferences.putString("name", "張三");
    preferences.flushSync();
   }
   if(focusView == readBtn) {
    int age = preferences.getInt("age", 0);
    String name = preferences.getString("name", "");
    log.setText("read user data frome preferences name:" + name + ", age:" + age);
   }
   if(focusView == addObserver) {
    if (addObserver.getText().equals("注冊(cè)觀察者")) {
     addObserver.setText("刪除觀察者");
     // 向preferences實(shí)例注冊(cè)觀察者
     counter = new PreferencesChangeCounter();
     preferences.registerObserver(counter);

    } else {
     addObserver.setText("注冊(cè)觀察者");
     // 向preferences實(shí)例注銷觀察者
     preferences.unregisterObserver(counter);
    }
   }
   return true;
  case KeyEvent.KEY_DPAD_UP:
   int position = views.indexOf(focusView.getId());
   if (position > 0) {
    switch (position) {
     case 1:
      writeBtn.requestFocus();
      break;
     case 2:
      readBtn.requestFocus();
      break;
     default:
      break;
    }
   }
   return true;
  case KeyEvent.KEY_DPAD_DOWN:
   position = views.indexOf(focusView.getId());
   if (position < 3) {
    switch (position) {
     case 0:
      readBtn.requestFocus();
      break;
     case 1:
      addObserver.requestFocus();
      break;
     default:
      break;
    }
   }
   return true;
 }
 return false;
}

4.編譯運(yùn)行該應(yīng)用

通過hdc連接大屏設(shè)備

先查看智慧屏IP：大屏設(shè)置->"網(wǎng)絡(luò)與連接"->"網(wǎng)絡(luò)"->"有線網(wǎng)絡(luò)"

在cmd或者IDE的Terminal輸入命令：

hdc tconn 192.168.3.9:5555

運(yùn)行hap

提示：需要通過注冊(cè)成開發(fā)者才能完成集成準(zhǔn)備中的操作。

干得好

你已經(jīng)成功完成了HarmonyOS應(yīng)用開發(fā)E2E體驗(yàn)，學(xué)到了：
如何創(chuàng)建一個(gè)HarmonyOS Demo Project
如何構(gòu)建一個(gè)Hap并且將其部署到真機(jī)上
在HarmonyOS上如何使用HarmonyOS的輕量級(jí)偏好數(shù)據(jù)庫

到此這篇關(guān)于HarmonyOS應(yīng) 基本控件的實(shí)現(xiàn)的文章就介紹到這了,更多相關(guān)HarmonyOS應(yīng) 基本控件內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: