AndroidとSVG     渡辺悟史(@sassy_watson)         ABC 2013 spring              2013/3/16
自己紹介• 渡辺 悟史(わたなべ さとし)• 通称 さっしー• twitter:@sassy_watson
自己紹介非PC向けWebブラウザ開発SNSアプリAndroid版開発  zigsowサービス開発
http://zigsow.jp
http://zigsow.jp• ジグソーは自分の大切なものをレ ビューしあうコミュニティサイトで す。• ぜひ使ってみてください。
自己紹介• 日本Androidの会テス ト部 運営委員• テスト部で本書きまし た(私はレビュアーと して参加しました)。 ぜひ読んでみてくださ い!
今日伝えたいこと• SVGとは何か?• AndroidでSVGを使えるの?
そもそもSVGって何?
SVGとは• Salable Vector Graphics• 拡大縮小可能なベクター画像のフォーマット• ピクセルの情報ではなく、位置や線の引き方 の情報を持っていて、計算してから描画する• 拡大・縮小しても同じ画像品質なの で、様々なデバイ...
SVGの書き方• SVGはXMLで書かれる• ルートの要素はSVG
SVGが扱うグラフィックス要素• ベクター画像• ラスタ画像• テキスト
ベクター画像• SVGは以下の基本図形が用意されている o   rect (矩形) o   circle (円) o   ellipse (楕円) o   line (直線) o   polyline (曲線) o   polygon (多角形...
<?xml version="1.0" ?><svg xmlns="http://www.w3.org/2000/svg">  <rect x="10" y="10" width="100"height="100" fill="red" str...
HTMLとSVG   • HTMLの中でもSVGを使うことが可能<html><body><svg>  <rect x="10" y="10" width="100"height="100" fill="red" /></svg></body><...
SVGとAndroid• Androidでは、Android3.0 (Honeycomb)以降、WebViewでSVG をサポート
AndroidでSVG    • SVGファイルをWebViewでロードpublic class MainActivity extends Activity {    @Override    public void onCreate(Bund...
• 皆さんもSVGを使ってAndroidアプリ を作ってみましょう!
AndroidとSVG (ABC 2013 Spring LT)
AndroidとSVG (ABC 2013 Spring LT)
Upcoming SlideShare
Loading in …5
×

AndroidとSVG (ABC 2013 Spring LT)

1,942 views
1,791 views

Published on

0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,942
On SlideShare
0
From Embeds
0
Number of Embeds
44
Actions
Shares
0
Downloads
4
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

AndroidとSVG (ABC 2013 Spring LT)

  1. 1. AndroidとSVG 渡辺悟史(@sassy_watson) ABC 2013 spring 2013/3/16
  2. 2. 自己紹介• 渡辺 悟史(わたなべ さとし)• 通称 さっしー• twitter:@sassy_watson
  3. 3. 自己紹介非PC向けWebブラウザ開発SNSアプリAndroid版開発 zigsowサービス開発
  4. 4. http://zigsow.jp
  5. 5. http://zigsow.jp• ジグソーは自分の大切なものをレ ビューしあうコミュニティサイトで す。• ぜひ使ってみてください。
  6. 6. 自己紹介• 日本Androidの会テス ト部 運営委員• テスト部で本書きまし た(私はレビュアーと して参加しました)。 ぜひ読んでみてくださ い!
  7. 7. 今日伝えたいこと• SVGとは何か?• AndroidでSVGを使えるの?
  8. 8. そもそもSVGって何?
  9. 9. SVGとは• Salable Vector Graphics• 拡大縮小可能なベクター画像のフォーマット• ピクセルの情報ではなく、位置や線の引き方 の情報を持っていて、計算してから描画する• 拡大・縮小しても同じ画像品質なの で、様々なデバイスに対応できる(ス マートフォンでもタブレットでも)
  10. 10. SVGの書き方• SVGはXMLで書かれる• ルートの要素はSVG
  11. 11. SVGが扱うグラフィックス要素• ベクター画像• ラスタ画像• テキスト
  12. 12. ベクター画像• SVGは以下の基本図形が用意されている o rect (矩形) o circle (円) o ellipse (楕円) o line (直線) o polyline (曲線) o polygon (多角形)• path要素でベジェ曲線を表現
  13. 13. <?xml version="1.0" ?><svg xmlns="http://www.w3.org/2000/svg"> <rect x="10" y="10" width="100"height="100" fill="red" stroke="blue"stroke-width="2" /></svg>
  14. 14. HTMLとSVG • HTMLの中でもSVGを使うことが可能<html><body><svg> <rect x="10" y="10" width="100"height="100" fill="red" /></svg></body></html>
  15. 15. SVGとAndroid• Androidでは、Android3.0 (Honeycomb)以降、WebViewでSVG をサポート
  16. 16. AndroidでSVG • SVGファイルをWebViewでロードpublic class MainActivity extends Activity { @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); WebView wv = (WebView)findViewById(R.id.webview); wv.loadUrl("file:///android_asset/index.svg"); }}
  17. 17. • 皆さんもSVGを使ってAndroidアプリ を作ってみましょう!

×