タブレット端末に関するニュース、皆さんの質問・回答をお届けします。
あなたの疑問解決のヒントになればいいのですが。
写真拡大【HTML5 Dev】キャンバスでアニメーションと複数デバイスの処理先週は「How To Create a Visual Library of Images in HTML5 Canvas」（HTML5 のキャンバスにイメージのビジュアルなライブラリを作成する）チュートリアルでマウス管理とステータス ストレージについて解説した。今週はアニメーション、そして複数デバイス処理を解説してチュートリアルを終了する。
アニメーション
我々のアプリケーションをより動きのあるものにするため、カードをダブルクリックするとズームし、そこにフォーカスを当てられるようにしよう。
ここでは、2つのオフセット（X、Y）値とズーム値という3つの値に動きを付ける。そこで、変数を開始値から終了値まで所定の時間で動かす関数を使う。
var AnimationHelper = function (root, name) {var paramName = name;this.animate = function (current, to, duration) {var offset = (to - current);var ticks = Math.floor(duration / 16);var offsetPart = offset / ticks;var ticksCount = 0; var intervalID = setInterval(function () {current += offsetPart;root[paramName] = current;ticksCount++; if (ticksCount == ticks) {clearInterval(intervalID);root[paramName] = to;}}, 16);};};
この関数の使い方は以下の通り
// Prepare animations parametersvarズーム AnimationHelper = new AnimationHelper(visuControl, "zoom");var offsetXAnimationHelper = new AnimationHelper(visuControl, "offsetX");var offsetYAnimationHelper = new AnimationHelper(visuControl, "offsetY");var speed = 1.1 - visuControl.zoom;zoomAnimationHelper.animate(visuControl.zoom, 1.0, 1000 * speed);offsetXAnimationHelper.animate(visuControl.offsetX, targetOffsetX, 1000 * speed);offsetYAnimationHelper.animate(visuControl.offsetY, targetOffsetY, 1000 * speed);
AnimationHelper 関数のよいところは、動かす変数の数を好きなだけ（しかも setTimer 関数だけで）増やせる点だ。
複数デバイスの処理
最後に、HTML 5ページがタブレット端末や携帯電話でも確実に表示できるようにする。
これには、CSS 3のメディアクエリ関数を使う。これにより、特定の画面サイズといったクエリに合わせてスタイルシートを適用できる。
<link href="Content/full.css" rel="stylesheet" type="text/css" /><link href="Content/mobile.css" rel="stylesheet" type="text/css" media="screen and (max-width: 480px)" /><link href="Content/mobile.css" rel="stylesheet" type="text/css" media="screen and (max-device-width: 480px)" />
ここでは、画面の幅が480ピクセル未満の場合に以下のスタイルシートが登録される。
#legal{font-size: 8px;} #title{font-size: 30px !important;} #waitText{font-size: 12px;} #bolasLogo{width: 48px;height: 48px;} #pictureCell{width: 48px;}
このシートはヘッダのサイズを縮小し、ブラウザの幅が480ピクセル未満（Windows Phone など）の場合でもサイトが表示できるようにする。
まとめ
HTML 5 / CSS 3 / JavaScript と Visual Studio 2010 を使えば、ハードウェア アクセラレーション対応レンダリングなどの素晴らしい機能を搭載する、移植性が高く効率的なソリューションを（もちろん HTML 5をサポートする Web ブラウザの制限内で）開発できるようになる。
この種の開発は、jQuery のようなフレームワークを使うとさらに簡略化できる。
また、筆者はパワフルなダイナミック言語である JavaScript の大ファンだ。もちろん C# や VB.NET の開発者は各自の考え方を変える必要があるものの、Web ページの開発においてはそれだけの価値がある。
結論として、確信を持つには試してみるしかないと思う。
参考
Internet Explorer テスト ドライブ：http://ie.microsoft.com/testdrive/開発者向け Internet Explorer 9ガイド：http://msdn.microsoft.com/en-us/ie/ff468705HTML5 向け W3C サイト：http://dev.w3.org/html5/spec/Overview.htmlInternet Explorer サイト：http://msdn.microsoft.com/en-us/ie/aa740469
本稿は Microsoft Corporation の許可を得て転載しており、原文はこちらにある。本サイトは Microsoft Corporation と提携している。
■関連記事
Google、3D 表示を進化させた WebGL 対応地図「MapsGL」リリース
アニメーションする地図が作れる「Animaps」
Facebook を利用した十人十色のドライブ BGM ジェネレーター「SUBARU SOUNDRIVE」
マクドナルドのハッピーセットに「カンフー・パンダ 2」と「ちびまる子ちゃん」が登場
追跡防止、CSS アニメーションなど--『Firefox 5』の新機能
http://news.livedoor.com/article/detail/6053936/
※この記事の著作権は配信元に帰属します。
----------------------------------------
wataaiceさん
タブレット端末を欲しいと思っているのですが、アンドロイド（Android）って、どういうOSなんですか？
iPadが有名ですけど値段が高いので、中国製みたいな格安のヤツでもいいと思ってます。
しかし、商品検索してみると、OSはAndroidっていうのがほとんどです。
スマートフォンとかで、この名前ぐらいは知っていますが、一体どういうOSなんでしょうか…？
用途としては、英語の勉強とか、メールやネット、動画を見るのがほとんどです。
よく使うソフトは、インターネットを見るのにfirefoxとかを使いたいのと、スカイプ、他には「紙copi」「gomプレイヤー」「craving explorer」「demon tools」みたいなフリーソフトです。これらがwindows7と同様に使えますか？
補足スカイプは、アンドロイド版があるんですね！！
ブラウザのこと、動画のことは、ちょっと長くなりそうなので、詳しくはあたらめて質問させてもらいます。
http://detail.chiebukuro.yahoo.co.jp/qa/question_detail.php?qid=147...
ベストアンサーに選ばれた回答
atsuo_watさん
・前回答者の仰るとおり、AndroidはGoogleが開発したモバイルデバイス向けのオペレーティングシステム(OS、基本ソフト)になります。無料且つ多くのメーカーに門戸を開いているので、Androidを採用したタブレット、スマートフォンが沢山あるのです。
・とりあえずFireFoxとSkypeはAndroid用の物があります。
http://mozilla.jp/firefox/mobile/
http://www.skype.com/intl/ja/get-skype/on-your-mobile/download/skyp...
その他Windows用アプリであげてらっしゃるソフトはそのままのものはAndroidにはありませんが同等のものはAndroidマーケットで探す事は可能かと思います。
もっともdemon toolの様な、ISOファイルをマウントする様な必要はAndroidタブレットにはありませんから、これに相当する物はないんじゃないかなと思いますよ。
http://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q1375961753
※この記事の著作権は配信元に帰属します。
ドコモが震災復興で専門組織 ネット構築など支援
http://headlines.yahoo.co.jp/hl?a=20111122-00000599-san-bus_all
いかがでしたか？
では、また次回。