HarmonyOS NextにおけるArkUI基本コンポーネントの実践ガイド
レイアウト設計の基礎と応用
ArkUIでは、画面構成は「コンポーネントの組み合わせ」として実現されます。適切なレイアウトを選択することで、視覚的にも操作的にも優れたインターフェースが構築可能です。
レイアウトの構造理解
青領域：要素の物理的なサイズ（width／heightで設定）
黄領域：実際の描画可能範囲（青領域 - ボーダー値）
緑領域：コンテンツの本質的な ...
8月11日 07:50 投稿
HarmonyOS PCアプリ開発の実践：分散型オフィスツールの構築
HarmonyOS PC：自律的で統合された計算環境の始まり
2025年5月19日、华为は成都にて「HarmonyOS PC」を正式発表し、中国が個人用コンピュータ向けオペレーティングシステム分野で重要な進展を達成したことを示した。従来のWindowsやmacOSとは異なり、この新製品は内核層から完全に自社開発されたアーキテクチャを採用しており、初めて一般ユーザー向けに提供された国産PC ...
8月11日 06:46 投稿
HarmonyOS Nextの状態管理におけるベストプラクティス
HarmonyOS Nextアプリ開発において、適切な状態管理はアプリのパフォーマンスと応答性を確保する鍵となります。以下に、ベストプラクティスに基づいた詳細な解説を示します。各プラクティスには、反例の分析と正例の改善が含まれており、対応するコード例も提供します。
@ObjectLinkを使用して不要な深いコピーを削減する
問題シナリオ
親子コンポーネント間のデータ受け ...
8月8日 01:58 投稿
HarmonyOS ArkUIにおけるカスタムダイアログの実装手法
HarmonyOSのUIフレームワークArkUIでは、CustomDialog機能を活用して柔軟なモーダル表示を実装できます。以下はダイアログ起動ボタンの基本実装例です。
Button('モーダル表示')
.onClick(() => {
this.modalManager.show()
})
.width('100%')
.Padding({ top: 20 })
メインビューとモーダル間の双方向通信を実現するには、コールバック関数と状態管理の連 ...
7月25日 01:26 投稿
HarmonyOS Nextにおける@Paramデコレータの活用
HarmonyOS Nextのコンポーネント指向フレームワークにおいて、子コンポーネントが親からデータを受け取る際の柔軟性と明確性を向上させるため、@Paramデコレータが導入されました。API version 12以降、@ComponentV2で定義されたカスタムコンポーネント内で@Paramを使用することが可能です。
@Paramデコレータの概要
@Paramは、親コンポーネントから子コンポーネント ...
7月5日 17:00 投稿
ArkUIにおけるスプリング曲線アニメーションの実装と物理パラメータの活用
スプリング曲線アニメーションの概要
ArkUIでは、LinearやEase、EaseInといった標準的なアニメーション曲線に加え、物理学のバネ・質量・ダンパーモデルに基づいた「スプリング曲線」を利用できます。この曲線を使用することで、アニメーションが目標値を超えて揺らぎ、最終的に収束するような、現実世界の物理挙動に近いインタラクティブな演出が可能になります。
ArkUI ...
7月4日 23:02 投稿
HarmonyOS ArkUIのレスポンシブグリッドレイアウト：GridRowとGridColの実装ガイド
グリッドシステムの基本概念
グリッドレイアウトは、多様な画面解像度やデバイスサイズに対応するための標準的な配置手法です。コンテナを等幅の列に分割することで、UI部品の配置基準が構造化され、マルチデバイス環境でのデザイン一貫性を担保します。ArkUIでは、親コンテナとなるGridRowと子セルを定義するGridColを連携させることで、柔軟なレスポンシブ構造を構築でき ...
6月25日 21:14 投稿
HarmonyOS アプリ開発：ArkUI を用いたページ遷移とパラメータ管理の実装
ナビゲーションスタックの挙動とモード設定
アプリケーション内でのユーザー体験を向上させるためには、ページ間を滑らかに移動できることが不可欠です。ArkUI のルーティング機構では、現在のページ状態を維持するかどうかによって、複数の操作モードが提供されています。主に「スタンダードモード」と「シングルモード」が利用可能です。
例えば、ログイン後のプロフィー ...
6月23日 16:57 投稿
HarmonyOS ArkUIにおけるSwiperコンポーネントの実装テクニック
ループ再生機能の実装
Swiperコンポーネントで無限ループを実現するには、continuousプロパティを有効化します。
@Entry
@Component
struct CarouselExample {
private carouselController: CarouselController = new CarouselController()
build() {
Swiper(this.carouselController) {
Text("A")
.size('100%')
.bgC ...
6月18日 18:39 投稿
HarmonyOS ArkUI でのメディアクエリの実装と応用
HarmonyOS の ArkUI では、mediaquery モジュールを用いてデバイスの状態（例：画面向き、解像度など）に応じて UI を動的に変更できます。以下は、横画面（landscape）かどうかを監視し、状態変化時にコールバックを実行する基本的な実装です。
import mediaquery from '@ohos.mediaquery';
// 横画面条件でメディアクエリを同期的に生成
const mediaListener = mediaqu ...
6月15日 23:50 投稿