Kaiosアプリを構築するためのUIコンポーネントライブラリ。すべてのコンポーネントとビューは、携帯電話のDパッドとソフトキーを使用して航行可能です。
注意:一部のコンポーネントのスタイル仕様は最近更新されましたが、この実装にはまだ反映されていません。 Mediumに関するKaiosのブログ記事を参照してください。
KaiuiはまだNPMに展開されていません。デモアプリの実行で構築および再生するには:
npm install
npm start
Kaiosエミュレーターで使用するには、構築する必要があります
npm build
実行する前に、index.htmlのJSおよびCSSファイルのハッシュを手動で更新します。
すべての仕様はここにあります
| 名前 | プレビュー | 仕様 |
|---|---|---|
| ヘッダ | ![]() | ![]() |
| タブ | ![]() | ![]() |
| ソフトキー | ![]() | ![]() |
| テキストリスト項目 | ![]() | ![]() |
| ボディテキストリスト項目 | ![]() | |
| アイコンリスト項目 | ![]() | |
| 矢印リストアイテム | ![]() | |
| セパレーター | ![]() | ![]() |
| チェックボックス | ![]() | ![]() |
| ラジオボタン | ![]() | |
| 進捗ダウンロード | ![]() | ![]() |
| 進捗状況 | ![]() | |
| スライダー | ![]() | ![]() |
| ボタン | ![]() | ![]() |
| 入力 | ![]() | ![]() |
ナビゲーションの詳細はこちらをご覧ください
| 名前 | プレビュー |
|---|---|
| tabview | ![]() |
| ListView | ![]() |
| 名前 | プレビュー | 仕様 |
|---|---|---|
| トースト | ![]() | ![]() |
通知は、アプリの実行中に標準通知APIを使用するときにKaios自体が提供します。インストールされているアプリは、マニフェストファイルを介してこの許可を要求する必要があります。この行をmanifest.webappファイルの[許可]セクションに追加するだけです。
"desktop-notification": {}
これが追加されたら、許可を要求する必要なくユーザー通知を送信できます。
標準化された色とフォントスタイリングは、テーマディレクトリにあります。これらは、カイオスのタイポグラフィ標準に従います。現在、プロップを使用してコンポーネントのフォーカスカラーをカスタマイズできます。フォントカラーはWIPです。
Kaiuiは、Kaios Developer Portalで提供されるカスタムアイコンを使用しています。これらはKai-Iconsフォントに含まれており、SASS/CSSクラスとして組み込まれています。
より多くのUIコンポーネントを構築し、テストを作成し、タイピングを統合する(おそらくフローを使用)統合することには、多くの作業があります。現在開いている問題と私たちの寄稿ガイドを見てください