1 devstudio3.1β2의 새로운 기능 UI
1.1 시작 스플래시 화면(혐오스러운 스플래시 화면 광고 포함)
부트 스플래시 화면의 원리는 프로그램 시작 시 페이지를 표시하는 것으로 백그라운드에서 데이터를 로드하는 데 사용되며 데이터가 로드되면 자동으로 사라지지만 나중에 타사 광고를 표시하도록 개발되었습니다. .
수명 주기 함수 aboutToAppear는 사용자 지정 구성 요소의 새 인스턴스를 생성한 후 build() 함수를 실행하기 전에 실행됩니다. aboutToAppear 함수에서 상태 변수를 변경할 수 있으며 이후에 build() 함수를 실행할 때 변경 사항이 적용됩니다. aboutToDisappear 함수는 커스텀 컴포넌트가 파괴되기 전에 실행됩니다. 이 두 가지 기능은 표시 페이지가 생성되기 전에 판단을 완료하고 표시 후 자동 파기하는 데 사용할 수 있습니다. aboutToAppear에 판단력이 더해지면 회원들은 광고를 건너뛰게 됩니다^_^. 구체적인 코드는 다음과 같습니다.
페이지 수명 주기 함수 aboutToAppear:
aboutToAppear() {
let preferences = data_preferences.getPreferences(this.context, H_STORE);
preferences.then((res) => {
res.get(IS_PRIVACY, false).then((isPrivate) => {
if (isPrivate === true) {
this.jumpAdPage();
} else {
this.dialogController.open();
}
});
});
}
복사
수명 주기 페이지 파괴 기능 aboutToDisappear:
aboutToDisappear() {
clearTimeout();
}
복사
1.2 광고 페이지 디자인
국가의 요구 사항에 따라 광고를 건너 뛰는 링크를 설계하고 카운트 다운 후 5 초 이내에 광고 표시를 종료하십시오.물론 더 무자비한 경우 흔들거나 만지는 등의 전환 방법도 설계 할 수 있습니다. 실수는 있지만 사용자 경험이 좋지 않습니다 물론 기술이 원죄가 아니라 탐욕입니다.
키 코드는 다음과 같습니다.
Row() {
Text($r('app.string.jump_ad', this.duration))
.fontSize($r('app.float.default_12'))
.fontColor($r('app.color.white'))
.borderRadius($r('app.float.default_16'))
.letterSpacing(LETTER_1)
.height($r('app.float.default_36'))
.backgroundColor('rgba(0,0,0,0.20)')
.border({ color: $r('app.color.white'), width: $r('app.float.default_1') })
.margin({ top: $r('app.float.default_36') })
.padding($r('app.float.default_8'))
.onClick(() => this.goToHomePage())
}
.width('90%')
.justifyContent(FlexAlign.End)
복사
1.2 로우코드 디자인 메인 페이지
로우코드 모드로 메인 페이지를 디자인하는데 탭 컴포넌트와 탭커넥트 컴포넌트를 주로 사용했는데 학습비용이 상당히 비싸고 파라미터 설정과 이벤트 설정이 많아서 프로토타입을 바꿔서 변환했습니다. ets에 직접 코드를 작성하는 효율성은 여전히 약간 높습니다. 로우 코드 설계는 다음과 같습니다.
1.3 로우 코드 디자인 컴포넌트 ATS
시각적 구성 요소의 디자인은 목록 구성 요소와 listitem 구성 요소를 사용하며 인터페이스의 foreach는 데이터 바인딩 방법을 모르기 때문에 코드를 반만 변환할 수 있습니다.
2개의 데이터베이스 작업
데이터베이스는 애플리케이션 데이터 저장소를 읽을 수 있는 가장 쉬운 방법입니다. 이 응용 프로그램은 주로 rdb를 사용하며 건강 계획을 읽고 편집할 수 있는 특정 패키지를 포함합니다. 특정 코드는 패키지된 데이터베이스 액세스 구성 요소를 재사용합니다.
3작품 전시