Maison > tutoriels informatiques > connaissances en informatique > Poésie aléatoire d'application native Hongmeng

Poésie aléatoire d'application native Hongmeng

PHPz
Libérer: 2024-02-19 13:36:31
avant
774 Les gens l'ont consulté

Poésie aléatoire dapplication native Hongmeng

Pour en savoir plus sur l'open source, veuillez visiter :

Communauté de développeurs 51CTO Hongmeng

https://ost.51cto.com

Environnement de course

DAYU200:4.0.10.16

SDK : 4.0.10.15

IDE : 4.0.600

1. Créer une application

Cliquez sur Fichier->Nouveau fichier->Créer un projet.

Choisissez un modèle :

【OpenHarmony】Capacité vide :

Renseignez le nom du projet, shici, le nom du package d'application com.nut.shici et l'emplacement de stockage de l'application XXX (pas de chinois, de caractères spéciaux ou d'espaces).

Compilez le SDK10, Modèle : Stage.

Le type d'appareil convient par défaut.

nœud, 16.20.1 recommandé.

Cliquez sur Terminer après avoir terminé la configuration ci-dessus.

Choisissez d'ouvrir dans une nouvelle fenêtre et attendez que les dépendances soient chargées. comme le montre la photo.

Si vous obtenez une erreur lors du chargement des dépendances, vérifiez votre réseau.

2. Exécutez HelloWord

Alimentez la carte de développement et connectez la carte de développement à l'ordinateur, comme indiqué sur l'image :

Signature :

Étapes pour signer :

Cliquez sur Fichier-> Structure du projet.

Sélectionnez le troisième élément Configurations de signature.

Ici, il nous suffit de cocher Générer automatiquement. Il n'est pas nécessaire de cocher Support HarmonyOS car nous gérons une carte de développement.

Cliquez sur Appliquer ou sur OK.

Cliquez maintenant sur le bouton pour exécuter le projet.

Informations sur l'impression de la console :

$ hdc uninstall com.nut.shici
$ hdc shell mkdir data/local/tmp/a1bdb2dbe1724c67a1106c360a3f1d35
$ hdc file send "/Users/jianguo/Desktop/teaching/ohcode/shici/entry/build/default/outputs/default/entry-default-signed.hap" "data/local/tmp/a1bdb2dbe1724c67a1106c360a3f1d35"
$ hdc shell bm install -p data/local/tmp/a1bdb2dbe1724c67a1106c360a3f1d35 
$ hdc shell rm -rf data/local/tmp/a1bdb2dbe1724c67a1106c360a3f1d35
$ hdc shell aa start -a EntryAbility -b com.nut.shici
Copier après la connexion

Prouvez que le projet a été exécuté avec succès au sein du conseil de développement.

3. Modifier l'icône et le nom

Modifier l'icône et le nom de l'application :

Le répertoire est dans AppScope/app.json5.

{
"app": {
"bundleName": "com.nut.shici",
"vendor": "example",
"versionCode": 1000000,
"versionName": "1.0.0",
"icon": "$media:app_icon",
"label": "$string:app_name"
}
}
Copier après la connexion

Comme le montre l'image après modification :

Une fois la modification réussie, comme le montre l'image :

Méthode ouverte, accédez à Paramètres-Gestion des applications.

Modifier les icônes et les noms du bureau

Modifiez l'étiquette et l'icône dans src/main/module.json5 comme indiqué dans l'image.

Lorsque l'on modifie le label, il suffit de le modifier dans l'annuaire chinois.

{
"module": {
"name": "entry",
"type": "entry",
"description": "$string:module_desc",
"mainElement": "EntryAbility",
"deviceTypes": [
"default",
"tablet"
],
"deliveryWithInstall": true,
"installationFree": false,
"pages": "$profile:main_pages",
"abilities": [
{
"name": "EntryAbility",
"srcEntry": "./ets/entryability/EntryAbility.ets",
"description": "$string:EntryAbility_desc",
"icon": "$media:icon",
"label": "$string:EntryAbility_label",
"startWindowIcon": "$media:startIcon",
"startWindowBackground": "$color:start_window_background",
"exported": true,
"skills": [
{
"entities": [
"entity.system.home"
],
"actions": [
"action.system.home"
]
}
]
}
]
}
}
Copier après la connexion

Modifiez le répertoire chinois.

L'effet est comme sur l'image :

4. Ajoutez les autorisations pertinentes

Étant donné que les données réseau sont nécessaires, l'autorisation d'intention est ajoutée.

Ajoutez la configuration dans le modèle dans src/main/module.json5, puis utilisez async.

"requestPermissions": [{
"name": "ohos.permission.INTERNET"
}],
Copier après la connexion

5. Définir le modèle de données

Créez un nouveau dossier modèle dans le répertoire ets.

Créez un nouveau fichier TS.

export class ShiciModel {
code: number = 0
message: string = ""
data: ShiCi = new ShiCi()
}

export class ShiCi {
content: string = ""
author: string = ""

origin: string = ""
category: string = ""
c1: string = ""
c2: string = ""
c3: string = ""

// "content": "微雨过,小荷翻。榴花开欲然。",
// "author": "苏轼",
// "origin": "阮郎归·初夏",
// "category": "古诗文-植物-荷花",
// "c1": "gushiwen",
// "c2": "zhiwu",
// "c3": "hehua"
}
Copier après la connexion

6. Charger les données du réseau

Description de l'interface

Préparez vos données,

Interface

Adresse de l'interface : https://v2.alapi.cn/api/shici

Méthode de requête : [ « GET », « POST » ]

Paramètres de la requête :

Nom

Obligatoire

Type

Description

Exemple

jeton

vrai

ficelle

Demandez un jeton et obtenez-le auprès du centre utilisateur.

Centre utilisateur pour obtenir un jeton

format

faux

ficelle

返回格式,支持json,text

json

type

string

诗词类型

all

  • type 参数值说明
  • all 所有类型
  • shuqing抒情
  • siji四季
  • shanshui山水
  • tianqi天气
  • renwu人物
  • shenghuo生活
  • jieri节日
  • dongwu动物
  • zhiwu植物

返回参数:

名称

描述

content

诗词内容

author

作者

origin

诗词题

测试接口

测试工具:Postamn。

{
"code": 200,
"msg": "success",
"data": {
"content": "地冷叶先尽,谷寒云不行。",
"author": "李白",
"origin": "冬日归旧山",
"category": "古诗文-植物-叶子",
"c1": "gushiwen",
"c2": "zhiwu",
"c3": "yezi"
},
"time": 1704770459,
"usage": 0,
"log_id": "603184784204148736"
}
Copier après la connexion

测试如图所示:

创建HTTP请求

导入http模块:

import http from '@ohos.net.http';
import { BusinessError } from '@ohos.base';
Copier après la connexion

创建createHttp:

let httpRequest = http.createHttp();
Copier après la connexion

填写HTTP地址:

httpRequest.request(// 填写HTTP请求的URL地址,可以带参数也可以不带参数。URL地址需要开发者自定义。请求的参数可以在extraData中指定
"https://v2.alapi.cn/api/shici",
{
method: http.RequestMethod.GET, // 可选,默认为http.RequestMethod.GET
// // 开发者根据自身业务需要添加header字段
header: [{
'Content-Type': 'application/json'
}],
// 当使用POST请求时此字段用于传递内容
extraData: {
"token": "自己的token",
"type": "all",
"format": "json"
},
 
}, (err: BusinessError, data: http.HttpResponse) => {
 
}
);
Copier après la connexion

对网络数据的处理:

if (!err) {


// data.result为HTTP响应内容,可根据业务需要进行解析
console.info('Result:' + JSON.stringify(data.result));
console.info('code:' + JSON.stringify(data.responseCode));
// data.header为HTTP响应头,可根据业务需要进行解析
console.info('header:' + JSON.stringify(data.header));
console.info('cookies:' + JSON.stringify(data.cookies)); // 8+
// 当该请求使用完毕时,调用destroy方法主动销毁
httpRequest.destroy();
} else {
this.message = JSON.stringify(err)
console.error('error:' + JSON.stringify(err));
// 取消订阅HTTP响应头事件
httpRequest.off('headersReceive');
// 当该请求使用完毕时,调用destroy方法主动销毁
httpRequest.destroy();
}
Copier après la connexion

完成以上配置以后。

在应用程序里测试网络请求。

build() {

Column() {

Button("测试网络请求").onClick(() => {
this.httpData()
})
}.width("100%").height("100%").justifyContent(FlexAlign.Center)
}
}
Copier après la connexion

如图所示:

测试成功。

如果2300006错误码,请检查网络。

七、UI

数据获取到之后,我们就剩在页面上显示了。

U I布局如图所示。

build() {

Column() {
Text(this.shici.origin).fontSize(30).fontWeight(800)
Text(this.shici.author).fontSize(20).fontWeight(300).fontColor(Color.Orange)
Text(this.shici.category).fontSize(20).fontWeight(300).fontColor(Color.Green)


}.width("100%").height("100%").justifyContent(FlexAlign.Center)
}
Copier après la connexion

八、完整源码

import http from '@ohos.net.http';
import { BusinessError } from '@ohos.base';
import promptAction from '@ohos.promptAction';
import { ShiCi, ShiciModel } from '../../model/ShiCiModel';


class shiciType {
title: string = ""
desc: string = ""
}

@Entry
@Component
struct Index {
@State shici: ShiCi = new ShiCi()
@State typeList: Array = [
{ title: "抒情",
desc: "shuqing"

},
{ title: "四季",
desc: "siji"

},
{ title: "山水",
desc: "shanshui"

}
,
{ title: "天气",
desc: "tianqi"

}


]

aboutToAppear() {
this.httpData("all")
}

httpData(type: string) {


// 3.每一个httpRequest对应一个HTTP请求任务,不可复用
let httpRequest = http.createHttp();
//4.
httpRequest.request(// 填写HTTP请求的URL地址,可以带参数也可以不带参数。URL地址需要开发者自定义。请求的参数可以在extraData中指定
"https://v2.alapi.cn/api/shici",
{
method: http.RequestMethod.GET, // 可选,默认为http.RequestMethod.GET
// // 开发者根据自身业务需要添加header字段
header: [{
'Content-Type': 'application/json'
}],
// 当使用POST请求时此字段用于传递内容
extraData: {
"token": "你的token",

"type": type,
"format": "json"
},

}, (err: BusinessError, data: http.HttpResponse) => {
if (!err) {
// data.result为HTTP响应内容,可根据业务需要进行解析
console.info('Result:' + JSON.stringify(data.result));
let ShiciModel: ShiciModel = JSON.parse(data.result.toString())
this.shici = ShiciModel.data

console.info('code:' + JSON.stringify(data.responseCode));
 
// 当该请求使用完毕时,调用destroy方法主动销毁
httpRequest.destroy();
} else {

console.error('error:' + JSON.stringify(err));
// 取消订阅HTTP响应头事件
httpRequest.off('headersReceive');
// 当该请求使用完毕时,调用destroy方法主动销毁
httpRequest.destroy();
}
}
);
}

build() {

Column() {


Row() {
ForEach(this.typeList, (item: shiciType) => {

Text(item.title).fontSize(30).margin(20)
.onClick(() => {

this.httpData(item.desc)
})
})

}

Button(
"抒情"
).onClick(() => {
this.httpData("shuqing")
})

Button(
"四季"
).onClick(() => {
this.httpData("siji")
})


Text(this.shici.origin).fontSize(30).fontWeight(800)
Text(this.shici.author).fontSize(20).fontWeight(300).fontColor(Color.Orange)
Text(this.shici.category).fontSize(20).fontWeight(300).fontColor(Color.Green)


}.width("100%").height("100%").justifyContent(FlexAlign.Center)
}
}
Copier après la connexion

九、总结

本文我们学习了基础组件的使用,网络请求,以及状态管理。

十、FAQ

2300006 域名解析失败

错误信息

Couldn’t resolve host name。

错误描述

服务器的域名无法解析。

可能原因

  • 传入的服务器的URL不正确。
  • 网络不通畅。

处理步骤

  • 请检查输入的服务器的URL是否合理。
  • 请检查网络连接情况

想了解更多关于开源的内容,请访问:

51CTO 鸿蒙开发者社区

https://ost.51cto.com

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:mryunwei.com
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal