TutorialsTu

Top / Coding / JavaScript / モバイルフレームワーク / WinkToolkit / 翻訳 / TutorialsTu

ページ構成

Wink Toolkit core †

Wink Toolkit は、以下に示す７つのファミリに分かれています。

core
graphical (ui)
interactions (ux)
multimedia (mm)
network (net)
HTML5 (api)
CSS effects (fx)
mathematic libraries (math)

この中で、coreは最も重要なものになります。

coreには、"wink"名前空間の定義が含まれ、さらに、開発者がwebappを構築するに当たって必要となるありとあらゆる基本的な機能、例えば、HTTP requests utilities (xhr)からイベント管理システム(topics) や DOM拡張機能といったものが含まれています。

Wink Toolkitにおけるその他のコンポーネントはいずれも、このcoreレイヤの上に実装されています。

coreの全ての機能は、ドキュメントやこのチュートリアル内に詳述されています。そのため、Wink Toolkitを使い始める前に、これらについて一通り目を通し、coreがどういった機能を備えているか把握しておくことをおすすめします。

Wink Toolkit はモバイル端末用の toolkit であり、coreに関してはできる限り軽量に保ちたいと考えています。現在、一度ビルドすれば、coreは約19KBになります。このサイズは、以下のjsファイルが含んでのものです。

2dfx.js
base.js
basics.js
dom.js
error.js
event.js
feat.js
feat_css.js
feat_dom.js
feat_event.js
feat_json.js
json.js
layer.js
topics.js
touch.js
ua.js
xhr.js

"optimized kit"をダウンロードした場合、zipファイルに含まれるcoreは既にビルドされており、最適化されています。zipファイルのルートには、"wink.min.js"という名前のファイルがあり、それが最適化されたコアになります。"optimized kit"は、ここからダウンロードすることができます。

"source code"をダウンロードした場合、coreを自分でビルドする必要があります。その方法については、チュートリアルの"building wink"の項目を参照してください。

webページへのcoreの組み込みは、"<head>" セクションに、wink.min.js への参照を追加するだけで可能です。

例 (coreをプロジェクトのルートディレクトリに配置している場合)：

<script type="text/javascript" src="wink.min.js"></script>

↑

その他のコンポーネント †

The Wink Toolkit components are considered graphical as soon as there is a rendering on the device's screen. You can find the list of the graphical components in the documentation section, under the "ui" label.

Graphical components range from very simple (e.g.: the accordion) to complex (e.g.: the tag cloud).

The best way to get a precise idea of what graphical components look like is to visit this site with your device. We also recommend you to have a close look at the test pages provided with Wink Toolkit and at the "instantiation" sections of each component's documentation.

In the "ux" family you will find everything related to the user interactions. From browser history management, to drag and drop or gesture recognition. All the features that handles touch event (touchstart, touchmove...) or gesture events (gesturestart, gestureend...) can be found in this family.

"mm"は、オーディオまたはビデオに関するものが含まれています。

network(net) は様々なローダー(JS ローダーや CSS ローダー)から構成されています。また、他のコンポーネントは、このnetworkを利用します。

"api" には、HTML5に関するもの、例えばローカルストレージやgeolocation（位置情報の取得）が含まれています。

"fx" には、2Dまたは3DのCSSによりtransformations(変形)やtransitions（アニメーション）が含まれています。

最後に、"math"には、種類の異なる数学ライブラリが含まれています。そのうちのいくつかには、幾何学的操作（例えば、ラジアンから度数への変換）が含まれ、また別のものには、行列演算に関するものが含まれています。