BT

Ready for InfoQ 3.0? Try the new design and let us know what you think!

Webix 1.3リリース - 新しいスキンとHTML5ビデオを追加,チャートウィジェットをアップデート

| 作者: Anand Narayanaswamy フォローする 0 人のフォロワー , 翻訳者 吉田 英人 フォローする 0 人のフォロワー 投稿日 2014年1月5日. 推定読書時間: 2 分 |

原文(投稿日:2013/12/14)へのリンク

Webix 1.3が新しいスキンとUI要素,いくつかの改良を加えてリリースされた。エア,コンパクト,雲,魅惑(glamour), ライト,テラス, Webなどのスキンを使って,アプリケーションのユーザインターフェースをソフトにしたり,あるいは非常に明るくするような変更が可能だ。

スキンに関連するCSSファイルは,パッケージのcodebase/skinsフォルダに配置されているので,アプリケーションにも簡単にスキンを組み込むことができる。“エア”スキンを適用するには,次のようなコードを使えばよい。

<script src="../codebase/webix.js"></script>  
<link href="../codebase/webix.css" rel="stylesheet" type="text/css">


同じように,”クラウド”スキンを使うアプリケーションは次のようになる。

<script src="../codebase/webix.js"></script>
<link href="../codebase/skins/clouds.css" rel="stylesheet" type="text/css">

Webixの公式資料には,すべての新しいスキンの使用方法が詳細に説明されている。Webix 1.3には新たにMP4, WebM, OggをサポートするHTML5 video要素が追加され,マルチメディアベースのアプリ開発が可能になった。以下のように使用する。

webix.ui({
    view:"video",
    id:"video1",
    container:"video_div"
    src: ["data/movie.ogv","data/movie.mp4"]
});


Carouselも改良された。さまざまなナビゲーションタイプを提供するとともに,使い勝手もよくなっている。Carouselは主として複数のコンポーネントを,専用ボタンあるいはタッチデバイスのスライドで切り替え可能な,単一のビューとして表示するように設計されている。使用方法は次のようになる。

webix.ui({
    view:"carousel",
    id:"carousel",
    cols:[
        { view:"template" },
        { view:"chart" },
        { view:"datatable" },
        { rows:[...]} //layout
    ]
});

Chartウィジェットもアップデートされた。対数スケールが使用可能になり,データ表現の選択肢が拡大されている。

この記事に星をつける

おすすめ度
スタイル

こんにちは

コメントするには InfoQアカウントの登録 または が必要です。InfoQ に登録するとさまざまなことができます。

アカウント登録をしてInfoQをお楽しみください。

あなたの意見をお聞かせください。

HTML: a,b,br,blockquote,i,li,pre,u,ul,p

このスレッドのメッセージについてEmailでリプライする
コミュニティコメント

HTML: a,b,br,blockquote,i,li,pre,u,ul,p

このスレッドのメッセージについてEmailでリプライする

HTML: a,b,br,blockquote,i,li,pre,u,ul,p

このスレッドのメッセージについてEmailでリプライする

ディスカッション
BT