コントロールとコンテンツの追加 (HTML)

  • [アーティクル]

[ この記事は、Windows ランタイム アプリを作成する Windows 8.x および Windows Phone 8.x 開発者を対象としています。Windows 10 向けの開発を行っている場合は、「最新のドキュメント」をご覧ください]

ボタン、チェック ボックス、ドロップダウン リストなどの コントロールはすべてのアプリに必要です。JavaScript を使った Windows ランタイム アプリでは、JavaScript 用 Windows ライブラリ ツールキットを使って、既存の HTML コントロールの機能拡張、コントロールや機能の追加をサポートします。

このセクションのトピックでは、これらのコントロールを使用する方法とスタイル設定方法について説明します。

このセクションの内容

トピック 説明

WinJS のコントロールとスタイルの追加

JavaScript 用 Windows ライブラリ コントロールを作る方法と使う方法の基本を説明します。

コントロールのスタイル指定

コントロールのスタイルを設定する方法と、JavaScript 用 Windows ライブラリによるスタイル機能を活用する方法について説明します。

項目コンテナーの追加

JavaScript を使って ItemContainer オブジェクトを Windows ストア アプリに追加する方法について説明します。

HTML コントロールの追加とイベントの処理

HTML コントロールを作成し、そのイベントを処理する方法について説明します。

宣言を使ってイベント ハンドラーを設定する方法

HTML コントロールおよび JavaScript 用 Windows ライブラリのコントロール向けのイベント ハンドラーを、HTML マークアップ内で宣言を使って設定する方法を説明します。

コントロールの一覧

ここでは、JavaScript を使った Windows ストア アプリの一般的なコントロールの一覧を、アルファベット順に表示します。

機能別コントロール

機能別にコントロールの一覧を示します。

リスト ビュー、セマンティック ズーム、FlipView の追加

ほとんどのアプリでは、イメージ ギャラリー、メール メッセージなどのデータのセットを操作および表示します。JavaScript 用 Windows ライブラリには、データを簡単に表示および操作するためのコントロールがいくつか用意されています。このセクションのトピックでは、FlipView、ListView、SemanticZoom などのデータ コントロールと表示コントロールについて説明します。

テキストの表示と編集

テキストを表示し、編集する方法について説明します。

画像、グラフィックス、サムネイルの表示

画像とサムネイルの表示の概要に関するトピックが用意されています。

ポップアップの表示

ポップアップ、メニュー、メッセージ ダイアログの表示の概要に関するトピックが用意されています。

ボタンの追加

button コントロールを使ってフォームの送信やリセットなどのコマンドをコミットします。ボタンは、コマンドをトリガーする簡単な方法です。

アプリ バーとコマンドの追加

ほとんどのアプリには、ユーザーが呼び出すことができるコマンドがあります。このセクションのトピックでは、ユーザーにコマンドを示すために使われる app bars、tool bars、および context menus について説明します。

選択コントロールの追加

選択コントロールを使うと、ユーザーは複数のオプションから選択できます。

評価の追加

このトピックでは、ユーザーが評価情報を入力できる、JavaScript 用 Windows ライブラリの Rating コントロールの使い方について説明します。

Page コントロールの追加

PageControl は、JavaScript 用 Windows ライブラリのカスタム コントロールに移動したり、カスタム コントロールとして使ったりすることができる、HTML、CSS、JavaScript のモジュール単位です。

プログレス コントロールの追加

プログレス コントロールを作成し、使う方法について説明します。これは、実行中の操作またはタスクの進行状況について画像で表すコントロールです。

ヒントの追加

ヒントは、他のコントロールまたはオブジェクトにリンクされた短い説明です。ヒントは、UI で直接説明されていない未知のオブジェクトまたはよく知らないオブジェクトについてユーザーが理解するのに役立ちます。ヒントは、ユーザーがコントロール上で長押しするか、マウス ポインターをコントロール上にホバーすると、自動的に表示されます。また、ユーザーが指またはマウス ポインターを移動したときに消えます。 ヒントのコンテンツとしてテキストまたは画像を使うことはできますが、対話的な操作はできません。

カスタム コントロールの作成

Windows 8 にはさまざまなコントロールが用意されていますが、独自のコントロールを作ることもできます。カスタム コントロールを作成する方法の 1 つは、PageControl を作成することです。詳しい情報と例については、「クイック スタート: Page コントロールの追加」をご覧ください。

キャンバス、SVG、CSS3 によるグラフィックスの使用

このセクションでは、JavaScript を使った Windows ストア アプリでグラフィックスを使う方法について説明します。