Sencha Touch MVCの応用 | Lab by engineering@dwango.jp
さて、前回は、 Sencha Touch と PhoneGap の導入編として Ext.NestedList を利用した簡単なサンプルアプリケーションを紹介しました。今回は、Sencha の世界では今後主流となる Sencha Touch MVC というMVC (Model View Controller) 構成を利用し、より実践的なサンプルアプリケーションの実装を解説します。 この記事のサンプルコードを GitHub で公開しています。 対象読者 Sencha Touch と PhoneGap の組み合わせに興味のある方を対象としています。 ただし、PhoneGap + Sencha Touch を利用したプロジェクトのセットアップ方法などについては解説しない為、詳細は前回の記事、及び PhoneGap の公式のサイトを参照してください。 準備 Eclipse で Android のプロ
Sencha Touch 勉強会に行ってきたので
メモるよ！ ExtJS が Sencha となって，Sencha Touch という iOS とか Android 向けのライブラリを作っているという，どっかの誰かたちがやってることとモロかぶりじゃねーか！みたいな話を聞きつけたので，行ってきましたよ！ しかも，会場がソフトバンク本社ということをすっかり忘れてサンダル出勤してしまっていたため，そのままサンダルで参戦しました(ﾃﾍｯ 公式ブログポストはこちら： http://www.extjs.co.jp/blog/2010/07/13/tokyo-meetup-jul-2010/ 以下，自分が興味をひかれたところのメモ↓ （ちなみに，※印は筆者の憶測です） Senchaへのブランド変更について（直鳥社長） なんで社名変更したのか？ いろんなプロジェクトが加わったためブランド名と社名が一緒なのはめんどくさくなった Extの名前空間は変わらない
# Sencha touchによるアニメーション - Qiita
Sencha touchを利用してjQueryの$("#element").animate({param: value})的なことをする方法 コード // element to animate. var elm = someComponent.element.query('.target'); Ext.Anim.run(Ext.get(elm), 'fade', { out : false, // true: fadeOut / false: fadeIn duration: 2000, delay: 1000, before: function(){ // call before animation }, after: function(){ // call after animation } });
javascript
アーカイブ 2021年December (1) 2020年June (1) 2016年August (1) 2016年June (5) 2016年April (10) 2016年February (7) 2016年January (5) 2015年December (5) 2015年November (2) 2015年October (3) 2015年September (3) 2015年August (1) 2015年July (9) 2015年June (7) 2015年May (6) 2015年April (9) 2015年March (1) 2015年February (7) 2015年January (3) 2014年December (6) 2014年November (7) 2014年October (11) 2014年September (11) 2014年August (
sencha touch カテゴリーの記事一覧 - 笑いながらコードを書く。
~ <div class="date">{[Ext.Date.format(values.date, "Y/m/d")]}</div>, ~ {[]}で囲むとjsで処理が書けるらしい。 values.dateが{date}と等価。
7月のExt JS勉強会（東京）「Sencha Touchのはじめかた 」まとめ | ExtJSで楽しくRIA業務アプリ開発
7月の勉強会(東京)のまとめになります。 開発環境 → 好きなやり方。とりあえずささっと試したいならjsdo.itがおすすめ。コードの共有もできる。デバイスに依存しない部分なら結構使える。 検証機(タッチパネルデバイス) → iPhone 3GS以降 or iPad が無難。Mac があるならiPhone シュミレーターが一番安定している。iPhone 3G,Android端末は微妙。 APIリファレンス → 発表し忘れ項目。Sencha Touchを学ぶうえで公式のAPIリファレンスはとても重要。Ext JSほど充実していないが、サンプルコードも載っているのですごく参考になります。Sencha Touchのパッケージにも入っていますが、以下のURLで見れます。もちろん英語です。 http://www.sencha.com/deploy/touch/docs/ 本家フォーラム
ありえるえりあミニ勉強会 #1: Hello Sencha Touch
先週4/25、弊社セミナールームにて、第一回目のありえるえりあミニ勉強会を開催しました。悪天候の中、ご参加下さった皆様どうもありがとうございました。勉強会では伝え切れなかった部分もあるので、内容を振り返りつつ、補足記事を書かせて頂こうかと思います。 勉強会で利用したスライド： http://kawanoshinobu.github.com/arielarea-1 当日の Ustream 中継： http://www.ustream.tv/recorded/22110265 Sencha Touch ひとめぐり Sencha Touch の概要について、簡単にお話しました。Sencha Touch はスマートフォン・タブレットのネイティブアプリライクな WEB アプリが作れる JavaScript のフレームワークで、今年の３月に 2.0 にメジャーバージョンアップしました。対応しているデバ
ありえるえりあミニ勉強会 #2: Theming Sencha Touch
先週の金曜日、弊社セミナールームにて、第二回目のありえるえりあミニ勉強会を開催しました。今回のテーマは、Sencha Touch アプリの見た目をカスタマイズする方法です。Sencha Touch で作ったアプリは、デフォルトのままでも十分綺麗ですが、アプリの個性を伝えるためにも、見た目はこだわりたい部分ですよね。 前回同様、今回も勉強会の内容を振り返りつつ、補足記事を書かせて頂きたいと思います。 勉強会で利用したスライド： http://kawanoshinobu.github.com/arielarea-2 当日の Ustream 中継： http://www.ustream.tv/recorded/22836796 Native vs Web Sencha Touch の勉強会に参加するのは今回が初めてという方も多数いらっしゃったので、いきなり具体的な解説を始める前に、少し抽象的なと
Sencha Touch 2 Recipes #5: Sublime Text を使って開発する
開発部 川野です。今回は少し趣旨を変えて、開発の Tips ではなく、Sencha Touch アプリの開発に適したエディタをご紹介させて頂こうと思います。 Sencha Touch のアプリは、規定の MVC（Model View Controller）構成でプロジェクトを作ることが想定されています。また、JavaScript ファイルを動的に読み込む機能や、Sass のコンパイルでも、規定のディレクトリ構成に従ってファイルが配置されていることを前提にしています。 こういった構成を強制されることでファイルが適切に分割されてメンテナンスし易くなるのですが、その分、ファイルの数が増えることになります。私が普段使っているエディタはバッファ間の移動が苦手なので、プロジェクトのファイルが増えてきた場合の移動が煩わしく、何かよい解決策がないか考えていました。 Sencha 社が提供しているスクリーン
Sencha Touch 2 Recipes #6: アプリケーションを最適化する
スマートフォンのブラウザで WEB アプリをストレスなく動作させるのは、結構難しいチャレンジです。モバイルブラウザは非力で、レンダリングもスクリプトの実行も PC ブラウザと比較すると桁違いに遅いです。また外出先で使われることが多い特性上、利用時のネットワーク状況も恵まれているとは言い難いですよね。 このような不利な状況でユーザーに快適に利用してもらうために、いくつか心がけたい工夫があります。 – サーバーへのリクエスト回数を最小限にする – ファイルのサイズを最小限にする – 静的ファイルを端末側にキャッシュさせる – ローディング画面を表示して、ユーザーを安心させる 特に、端末へのキャッシュは強力な手法で、うまく実装すれば電波の届かない状況で WEB アプリを動作させることも不可能ではありません。ただ、適切にファイルをキャッシュさせるのは、なかなか難しい課題のように思われます。意図通り
ありえるえりあミニ勉強会 #3: Sencha Touch Components
Sencha Touch をテーマに企画しているありえるえりあミニ勉強会、第三回目を先週金曜日に開催しました。 お越し頂いた皆様、どうもありがとうございました！興味はあるけど諸事情で参加できなかった方もいらっしゃると思うので、今回も簡単にまとめ記事を書かせて頂きます。 カスタムコンポーネントを作るためにおさえておきたい 10 のステップ 第三回目のテーマは「コンポーネント」です。ただ、Sencha Touch のコンポーネントについて、ドキュメントに書いてあるようなことを解説するだけだとつまらないので、何かよい切り口はないか考えていました。そんな訳で、今回の発表は、カスタムコンポーネントを作るステップを紹介する過程（＆デモ）で、コンポーネントについての理解を得てもらえるような内容にさせて頂きました。 # 残念ながら、Ustream 中継の録画ができていませんでした。。詳細はスライドから察し
Sencha Touch 入門:Sencha Touchのはじめかた（Ext JS & Sencha Touch勉強会7月＠東京）のサンプルコード | ExtJSで楽しくRIA業務アプリ開発
2010/7/25のExt JS & Sencha Touch勉強会7月＠東京でのsus4 佐竹の担当箇所のSencha Touch入門篇で使うサンプルコードをjsdo.itで公開しました。 明日の勉強会では、PCのブラウザでも動作するサンプルばかりですので、jsdo.it上でも動作を確認できます。 また簡単なサンプルばかりですので、forkしていただいて実際に手を動かしてももらうとより理解が深まると思います。 勉強会では持ち時間的に２,３つしか紹介できないと思います。 勉強会のアジェンダはこちらです。 Sencha Touch 入門: Ext JS & Sencha Touch勉強会7月＠東京(2010/7/25 )のアジェンダ Sencha Touchのはじめかたサンプルコード Sencha Hello, World! Hello, World! – jsdo.it – sh
Sencha Touchノート
TabPanelクラスはcardSwitchAnimationプロパティを利用することで、簡単にカード切り替えのアニメーションを作れます。 cubeアニメーションサンプル fadeアニメーションサンプル flipアニメーションサンプル popアニメーションサンプル slideアニメーションサンプル cubeアニメーションを行うJavaScriptは次のとおりです。cardSwitchAnimationプロパティの値に'cube'が指定してあります。 index.js Ext.setup({ onReady: function(){ var cards = [{ title: 'Photo 1', html: 'Photo 1 ', cls: 'card1' }, { title: 'Photo 2', html: 'Photo 2 ', cls: 'card2' }, { title: '
Sencha Touch を始めよう
このドキュメントではSencha Touchの始め方について解説していきます。 最初にタッチ型端末向けのWebアプリケーションを開発するための基本的なステップについての説明、 次に、Sencha Touchパッケージにも同梱されているデモアプリGeoTweetsの作り方についての詳細な説明 をしていきます。 このドキュメントはSencha Touchを使ってタッチ型端末向けのWebアプリケーションの開発をしたい Web開発者に向けたものです。前提条件としては、Sencha Touchライブラリをダウンロードしていること、 Webサーバー環境が用意されていること、そしてJavaScript・HTML・CSSなどのWebアプリケーション開発 に必要な技術や考え方について理解していること、があげられます。 このドキュメントは以下のセクションで構成されています： Sencha Touch について
一緒に始めようSencha Touch 2.0 入門編: 第1回 Sencha Touchを導入しよう
はじめまして、2012年新卒として入社致しました、だーますと申します。どうぞよろしくお願い致します。 今回はスマートフォンアプリのような操作性を持つWebアプリ開発フレームワークである"Sencha Touch 2.0"について解説させていただきます。 ■ Sencha Touchって何？ Sencha Touchとは、米国のSencha社が開発した、HTML5ベースのWebアプリ開発フレームワークです。 具体的な特徴 ・スマートフォンやタブレットのWebブラウザで動く、ネイティブアプリのようなアプリを作れる！ ・iOS、Androidのどちらでも動作する！ ・HTML5って書いてはあるけど、JavaScriptさえわかれば開発できる！ ・AjaxやJSONPリクエストもバッチリ送れる！ ・無料で利用でき、しかも商用もOK！ 対応OS ・iOS 4.0以上 (iPhone、iPod tou
Ext Japan - Sencha Touch登場 - モバイル用HTML5フレームワーク
業界初のHTML5モバイルアプリ用フレームワーク Sencha Touchを使えばタッチスクリーンを装備したApple iOSや Android端末上でネイティブアプリのようなWebアプリが開発可能です。 Web標準技術に準拠 Sencha TouchはHTML5、CSS3、JavaScriptに特化した世界初のアプリケーションフレームワークです。SSencha Touchはこれらの技術が持つ力を最大限に引き出し、かつ柔軟で最適化されたアプリケーション開発を可能にします。Sencha Touchでは、音声や動画を組み込む為のコンポーネントやデータをオフラインでも利用可能にするlocalStorageプロキシーなどでHTML5の機能が利用されています。またSencha TouchのスタイルシートではCSS3を最大限活用してとても堅牢なスタイリングレイヤーを実現しています。 このライブラリはそ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Sencha Touch in WebView
hello.tnker.com
Sencha Docs - Touch 2.0
Sencha Touch - 第30回HTML5とか勉強会-