머리말
지난번에 언급했듯이 `C++`를 사용하여 `UI` 인터페이스를 작성하는 경우 개발 효율성은 `JS+HTML`만큼 높지는 않지만 장치 개발에는 필연적으로 커널 상태를 통해 하드웨어를 작동해야 합니다. JS 프레임워크와 장치 드라이버 간의 연결 문제를 제거합니다. 이 장에서는 `HDF 드라이버`와 `JS+CSS+HTML` 기술을 기반으로 하며, 관련 내용은 ` Hongmeng을 사용하여 AI 애플리케이션 개발(5) HDF 드라이버 필 라이트` 및 ` Hongmeng을 사용하여 AI 애플리케이션 개발( 5)을 검토할 수 있습니다. 6) UI' `이 두 글입니다.
JS 애플리케이션 개발 프레임워크 원칙
JS
여섯 번째 기사에서는 개발 인터페이스를 사용하는 과정을 경험했으며 , ace
구현 원리에 대한 간단한 분석은 다음과 같습니다.
![](https://img-blog.csdnimg.cn/img_convert/4d1ab3cd81253e70535e83ff7271bfda.png)
먼저 프레임워크 다이어그램을 살펴보면 작은 프로그램과 같은 웹 애플리케이션이 먼저 js bundle
패키지 로 컴파일되고 JS Data binding
이를 통해 개체 매핑이 이루어집니다. 위의 객체 를 4가지 유형(render, data, styleSheet, function)으로 나누는 데 사용되는 미니멀리스트 MVVC 모델이 구현되었으며, 데이터 하이재킹 메커니즘을 사용하여 관찰자의 프로토타입 함수에 각각 마운트하고 Observer
이를 DOM
기능 C++
.구현.
소스코드를 보면 JS
그 부분이 미니멀하고, JS 엔진이 이를 사용하고 JerryScript
, 각 태그가 클래스에 해당한다는 것을 C++
알 수 있습니다 Component
. C++
이벤트 등록 및 트리거링, 페이지 라우팅, 컨트롤 업데이트, 시간 초과, 파일 작업, 명령줄 출력 등을 포함한 대부분의 기능이 실제로 구현됩니다 . 모든 API의 100% 도킹은 만화를 연상시킵니다.
도메인 에 진입한 C++
후 훨씬 더 편리합니다 . 현재 ACE
는 여전히 사용자 모드에 있으며 메시지 메커니즘을 HDF
사용하여 . 이는 다른 API 계층에 래핑된 마트료시카 작업에 지나지 않습니다.
내장 모듈
@system.xxx
앱, 라우터, 오디오, 센서 등에 액세스할 수 있는 장치 기능을 제공하는 일련의 모듈이 있습니다. 모듈의 별칭과 모듈 초기화 함수 간의 해당 관계를 ohos_module_config.h
정의합니다 . JS框架
그 중 app
, dfx
, router
모듈이 필요합니다.
// Config information for built-in JS modules of OHOS platform
const Module OHOS_MODULES[] = {
#ifdef ENABLE_MODULE_REQUIRE_TEST
{"sample", InitSampleModule},
#endif
{"app", InitAppModule},
#ifdef FEATURE_MODULE_AUDIO
{"audio", InitAudioModule},
#endif // FEATURE_MODULE_AUDIO
{"dfx", InitDfxModule},
{"router", InitRouterModule},
#ifdef ENABLE_MODULE_CIPHER
{"cipher", InitCipherModule},
#endif
};
ace 모듈 구현
배경 지식을 소개한 후, 업무의 복잡도에 따라 맞춤형 ace 모듈의 기능을 캡슐화할 수 있으며, 동작을 단순화하기 위해 내장된 모듈에 직접 동작을 탑재합니다 app
.
1. 헤더 파일 정의
수정하고 foundation/ace/frameworks/lite/src/core/modules/app_module.h
, ToggleLed
기능을 추가하고, 초기화하세요.
namespace OHOS {
namespace ACELite {
class AppModule final : public MemoryHeap {
public:
static JSIValue ToggleLed(const JSIValue thisVal, const JSIValue* args, uint8_t argsNum);
void InitAppModule(JSIValue exports)
{
JSI::SetModuleAPI(exports, "getInfo", AppModule::GetInfo);
JSI::SetModuleAPI(exports, "terminate", AppModule::Terminate);
JSI::SetModuleAPI(exports, "toggleLed", AppModule::ToggleLed);
}
} // namespace ACELite
} // namespace OHOS
#endif // OHOS_ACELITE_APP_MODULE_H
2. HDF 드라이버 호출
에 가입하세요 foundation/ace/frameworks/lite/src/core/modules/app_module.cpp
,
#include <fcntl.h>
#include <sys/stat.h>
#include <sys/ioctl.h>
#include <unistd.h>
#include "hdf_sbuf.h"
#include "hdf_io_service_if.h"
#define LED_WRITE_READ 1
#define LED_SERVICE "led_service"
JSIValue AppModule::ToggleLed(const JSIValue thisVal, const JSIValue *args, uint8_t argsNum)
{
HILOG_ERROR(HILOG_MODULE_ACE, "led button pressed.");
printf("led button pressed\n");
struct HdfIoService *serv = HdfIoServiceBind(LED_SERVICE, 0);
if (serv == NULL)
{
printf("fail to get service %s\n", LED_SERVICE);
return JSI::CreateUndefined();
}
static struct HdfDevEventlistener listener = {
.callBack = OnDevEventReceived,c
.priv = (void *)"Service0"};
if (HdfDeviceRegisterEventListener(serv, &listener) != HDF_SUCCESS)
{
printf("fail to register event listener\n");
return JSI::CreateUndefined();
}
const char *send_cmd = "toggle LED";
if (SendEvent(serv, send_cmd))
{
printf("fail to send event\n");
return JSI::CreateUndefined();
}
if (HdfDeviceUnregisterEventListener(serv, &listener))
{
printf("fail to unregister listener\n");
return JSI::CreateUndefined();
}
HdfIoServiceRecycle(serv);
return JSI::CreateUndefined();
}
3. HDF 헤더 파일 경로 구성
개정하다foundation/ace/frameworks/lite/src/core/modules/BUILD.gn
include_dirs = [
"presets",
"maplejs",
"//test/lite/testservice/include",
"//vendor/huawei/watchgt/devkit/hal/include",
"//foundation/distributedschedule/interfaces/innerkits/samgr_lite/communication/mpc/transport",
"//foundation/distributedschedule/interfaces/innerkits/samgr_lite/communication/mpc",
"//drivers/hdf/lite/include/host",
"$HDF_FRAMEWORKS/ability/sbuf/include",
"$HDF_FRAMEWORKS/core/shared/include",
"$HDF_FRAMEWORKS/core/host/include",
"$HDF_FRAMEWORKS/core/master/include",
"$HDF_FRAMEWORKS/include/core",
"$HDF_FRAMEWORKS/include/utils",
"$HDF_FRAMEWORKS/utils/include",
"$HDF_FRAMEWORKS/include/osal",
"$HDF_FRAMEWORKS/adapter/syscall/include",
"$HDF_FRAMEWORKS/adapter/vnode/include",
]
개정하다foundation/ace/frameworks/lite/BUILD.gn
config("ace_lite_config") {
include_dirs = [
...
]
include_dirs += [
"//drivers/hdf/lite/include/host",
"$HDF_FRAMEWORKS/ability/sbuf/include",
"$HDF_FRAMEWORKS/core/shared/include",
"$HDF_FRAMEWORKS/core/host/include",
"$HDF_FRAMEWORKS/core/master/include",
"$HDF_FRAMEWORKS/include/core",
"$HDF_FRAMEWORKS/include/utils",
"$HDF_FRAMEWORKS/utils/include",
"$HDF_FRAMEWORKS/include/osal",
"$HDF_FRAMEWORKS/adapter/syscall/include",
"$HDF_FRAMEWORKS/adapter/vnode/include",
]
}
shared_library("ace_lite") {
public_deps = [
"//base/security/frameworks/crypto_lite/js/builtin:ace_kit_cipher",
"//foundation/graphic/lite/frameworks/surface:surface",
"//foundation/multimedia/frameworks/camera_lite:camera",
"//foundation/multimedia/frameworks/player_lite:player",
"//foundation/multimedia/interfaces/kits/player_lite/js/builtin:audio_api",
"//third_party/bounds_checking_function:libsec_shared",
"//third_party/cJSON:cjson_shared",
"//third_party/jerryscript/jerry-core:jerry-core_shared",
"//third_party/jerryscript/jerry-ext:jerry-ext_shared",
"//third_party/jerryscript/jerry-libm:jerry-libm_shared",
"//third_party/jerryscript/jerry-port/default:jerry-port-default_shared",
"//utils/native/lite/js/builtin:ace_utils_kits",
"//utils/native/lite/timer_task:ace_kit_timer",
"//drivers/hdf/lite/manager:hdf_core",
"//drivers/hdf/lite/adapter/osal/posix:hdf_posix_osal",
]
}
4. 컴파일하고 굽기
python build.py my_hi3516dv300 -b debug
![](https://img-blog.csdnimg.cn/img_convert/a0c375ed1e2ccd209580051efcbd6f43.png)
HDF
드라이버와 프레임워크 의 경우 ACE
이미지 파일을 완전히 다시 구워야 합니다.
![](https://img-blog.csdnimg.cn/img_convert/c09ffc20ec35980e77aadab5b6ceddd8.png)
인터페이스 프로그램 개발
1. 모듈 인터페이스 구성
앞서 Python용으로 직접 얻을 수 없는 app
내장 모듈에 함수를 추가했기 때문에 먼저 인터페이스를 추가해야 합니다 .taggleLed
DevEco Studio
api
\Huawei\Sdk\js\2.0.1.93\api\smartVision\@system.app.d.ts
파일 수정
export default class App {
/**
* Obtains the declared information in the config.json file of an application.
*/
static getInfo(): IAppInfo;
/**
* Destroys the current ability.
*/
static terminate(): void;
/**
* 翻转Led
*/
static toggleLed(): void;
}
2. 페이지 트리거
여기서는 UI篇
이전 프로그램의 슬라이딩 이벤트를 사용하여 Led를 뒤집는 작업을 트리거합니다.
개정하다entry/src/main/js/default/pages/index/index.js
swiperChange (e) {
this.swiperPage = e.index;
if(e.index == 0){
this.iconcheckedColor = '#ffffff';
this.iconUncheckedColor = '#262626';
}else{
this.iconcheckedColor = '#262626';
this.iconUncheckedColor = '#ffffff';
}
// 调用翻转Led函数
app.toggleLed();
}
함수 toggleLed
이름은 ace
이전 모듈 초기화 등록에서 JSI::SetModuleAPI
정의한 문자열 이름과 일치 해야 합니다.
3. Hap으로 패키지화
Hap
이름이 바뀐 대로 애플리케이션을 패키징합니다.MyUILed.hap
![](https://img-blog.csdnimg.cn/img_convert/0475c1e4578fc6562ec1728e00be2079.png)
4. 장치에 설치
특정 nfs
매핑 디렉터리에 대해서는 이전 장을 참조하세요.
mkdir nfs
mount 192.168.1.52:/nfs /nfs nfs
cd nfs
./dev_tools/bin/bm set -s disable
./dev_tools/bin/bm install -p MyUILed.hap
![](https://img-blog.csdnimg.cn/img_convert/3afdc7603f959121a897b3c44a08ef31.png)
5. 프로그램 실행
메인 인터페이스를 밀고 Led灯
스위치를 확인하면 프로그램이 성공적으로 실행되고 있음을 의미합니다.
![](https://img-blog.csdnimg.cn/img_convert/a7aeff8c6c0f0b33927ecb7b0b2c8030.png)
전체 과정을 간략하게 요약하자면,
메인 페이지
index
, 가져오기import app from '@system.app'
모듈;app.toggleLed();
작업을 시작하기 위해 이벤트에서 호출됩니다 .포장 (기본적
JS框架
으로MyUILed.hap
zip 패키지)장치에 설치된 후 압축이 풀리고
JS代码
;장치의 프레임워크가
ace
통과되고JSI::SetModuleAPI
키워드JS代码
가"toggleLed"
해당C++
기능 에 매핑됩니다AppModule::ToggleLed
.AppModule::ToggleLed
함수에서 발견LED_SERVICE
,HDF
메시지 보내기커널의 드라이버는
HDF
메시지를 받은 후 실제로 이를 실행합니다LED翻转操作
.
이 시점에서 우리는 두 세계의 장점을 모두 가질 수 있습니다. UI
작은 프로그램과 같은 방식으로 아름다운 부품을 효율적으로 구축할 수 있을 뿐만 아니라 장치의 기본 기능에 C++
효율적으로 액세스하여 AI
수많은 후속 제품에 대한 길을 열어줍니다. 집중적인 계산.
다운로드
![](https://img-blog.csdnimg.cn/img_convert/fc95ae6165b9b4698ea27c5da6a288d1.png)
이 문제에 대한 관련 문서 및 정보는 공개 계정 "Deep Awakening"에서 찾을 수 있으며 백그라운드에서 "ohos08"이라고 답하여 다운로드 링크를 얻을 수 있습니다.
다음 기사 미리보기
최근 업데이트된 DevEco Device Tools 2.0,
많은 hpm 및 hos 명령을 통합합니다.
다음 글에서는 먼저 새로운 버전의 굽기 도구를 사용해 보겠습니다.
계속 지켜봐 주시기 바랍니다...
과거에 추천함