SlideShare una empresa de Scribd logo
1 de 19
Descargar para leer sin conexión
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 (多角形)
• path要素でベジェ曲線を表現
<?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>
HTMLとSVG

   • HTMLの中でもSVGを使うことが可能
<html>
<body>
<svg>
  <rect x="10" y="10" width="100"
height="100" fill="red" />
</svg>
</body>
</html>
SVGとAndroid


• Androidでは、Android3.0
 (Honeycomb)以降、WebViewでSVG
 をサポート
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");
    }
}
• 皆さんもSVGを使ってAndroidアプリ
 を作ってみましょう!
AndroidとSVG (ABC 2013 Spring LT)

Más contenido relacionado

La actualidad más candente

2012 jaws ug紹介(熊本ug版)
2012 jaws ug紹介(熊本ug版)2012 jaws ug紹介(熊本ug版)
2012 jaws ug紹介(熊本ug版)
Takeshita Kouhei
 
20140113目で見て分かる「必要な時、必要なだけ」
20140113目で見て分かる「必要な時、必要なだけ」20140113目で見て分かる「必要な時、必要なだけ」
20140113目で見て分かる「必要な時、必要なだけ」
Koichiro Nishijima
 
CSNagoyaコミュニティアピール
CSNagoyaコミュニティアピールCSNagoyaコミュニティアピール
CSNagoyaコミュニティアピール
ttlweb
 

La actualidad más candente (20)

サキブレの統計および 更新期間帯の予測
サキブレの統計および 更新期間帯の予測サキブレの統計および 更新期間帯の予測
サキブレの統計および 更新期間帯の予測
 
2012 jaws ug紹介(熊本ug版)
2012 jaws ug紹介(熊本ug版)2012 jaws ug紹介(熊本ug版)
2012 jaws ug紹介(熊本ug版)
 
201200127 jp stripes_osaka_vol5
201200127 jp stripes_osaka_vol5201200127 jp stripes_osaka_vol5
201200127 jp stripes_osaka_vol5
 
20140113目で見て分かる「必要な時、必要なだけ」
20140113目で見て分かる「必要な時、必要なだけ」20140113目で見て分かる「必要な時、必要なだけ」
20140113目で見て分かる「必要な時、必要なだけ」
 
教育に生かすしゅはり
教育に生かすしゅはり教育に生かすしゅはり
教育に生かすしゅはり
 
AizuVR LT
AizuVR LTAizuVR LT
AizuVR LT
 
Swp支援隊
Swp支援隊Swp支援隊
Swp支援隊
 
WordPress 勉強会@松戸 | テンプレートファイルとクエリ基礎
WordPress 勉強会@松戸 | テンプレートファイルとクエリ基礎WordPress 勉強会@松戸 | テンプレートファイルとクエリ基礎
WordPress 勉強会@松戸 | テンプレートファイルとクエリ基礎
 
20140822 営業の泥臭い話 dev_love現場甲子園2014西日本大会懇親会lt
20140822 営業の泥臭い話 dev_love現場甲子園2014西日本大会懇親会lt20140822 営業の泥臭い話 dev_love現場甲子園2014西日本大会懇親会lt
20140822 営業の泥臭い話 dev_love現場甲子園2014西日本大会懇親会lt
 
CSNagoyaコミュニティアピール
CSNagoyaコミュニティアピールCSNagoyaコミュニティアピール
CSNagoyaコミュニティアピール
 
プレゼン技術研究会を二年やってみてプレゼンについてわかった3つのこと
プレゼン技術研究会を二年やってみてプレゼンについてわかった3つのことプレゼン技術研究会を二年やってみてプレゼンについてわかった3つのこと
プレゼン技術研究会を二年やってみてプレゼンについてわかった3つのこと
 
スマートフォンってなあに?さわってみようスマートフォン
スマートフォンってなあに?さわってみようスマートフォンスマートフォンってなあに?さわってみようスマートフォン
スマートフォンってなあに?さわってみようスマートフォン
 
カスタムフィールドを使ってハッピーになろう
カスタムフィールドを使ってハッピーになろうカスタムフィールドを使ってハッピーになろう
カスタムフィールドを使ってハッピーになろう
 
文系から半年でRuby(Sinatra, Rails)を学んだら人生変わった@沖縄Ruby会議02
文系から半年でRuby(Sinatra, Rails)を学んだら人生変わった@沖縄Ruby会議02文系から半年でRuby(Sinatra, Rails)を学んだら人生変わった@沖縄Ruby会議02
文系から半年でRuby(Sinatra, Rails)を学んだら人生変わった@沖縄Ruby会議02
 
[Jagys3]android執筆書籍紹介
[Jagys3]android執筆書籍紹介[Jagys3]android執筆書籍紹介
[Jagys3]android執筆書籍紹介
 
はじめてのカスタマイズ
はじめてのカスタマイズはじめてのカスタマイズ
はじめてのカスタマイズ
 
[WordCampKyoto2017]レンサバで頑張ってるあなたに捧ぐ
[WordCampKyoto2017]レンサバで頑張ってるあなたに捧ぐ[WordCampKyoto2017]レンサバで頑張ってるあなたに捧ぐ
[WordCampKyoto2017]レンサバで頑張ってるあなたに捧ぐ
 
個人メディアで成功3条件は面白い人・マメな人・続ける人
個人メディアで成功3条件は面白い人・マメな人・続ける人個人メディアで成功3条件は面白い人・マメな人・続ける人
個人メディアで成功3条件は面白い人・マメな人・続ける人
 
オウンドメディアの編集者とライターのこれからを考えてみた。
オウンドメディアの編集者とライターのこれからを考えてみた。オウンドメディアの編集者とライターのこれからを考えてみた。
オウンドメディアの編集者とライターのこれからを考えてみた。
 
Katawa shoujo player_guide_ja
Katawa shoujo player_guide_jaKatawa shoujo player_guide_ja
Katawa shoujo player_guide_ja
 

Destacado (7)

高専カンファレンス2010秋 予告編
高専カンファレンス2010秋 予告編高専カンファレンス2010秋 予告編
高専カンファレンス2010秋 予告編
 
World Wide Ruby Conferences
World Wide Ruby ConferencesWorld Wide Ruby Conferences
World Wide Ruby Conferences
 
Debug Hacks at Security and Programming camp 2011
Debug Hacks at Security and Programming camp 2011 Debug Hacks at Security and Programming camp 2011
Debug Hacks at Security and Programming camp 2011
 
DevLOVE LT: Do you know axes of software testing?
DevLOVE LT: Do you know axes of software testing?DevLOVE LT: Do you know axes of software testing?
DevLOVE LT: Do you know axes of software testing?
 
Code Reading at Security and Programming camp 2011
Code Reading at Security and Programming camp 2011 Code Reading at Security and Programming camp 2011
Code Reading at Security and Programming camp 2011
 
九州ソフトウェアテスト勉強会紹介LT:Developers Summit 2016 FUKUOKA懇親会
九州ソフトウェアテスト勉強会紹介LT:Developers Summit 2016 FUKUOKA懇親会九州ソフトウェアテスト勉強会紹介LT:Developers Summit 2016 FUKUOKA懇親会
九州ソフトウェアテスト勉強会紹介LT:Developers Summit 2016 FUKUOKA懇親会
 
VCS - Version Control System at Security and Programming camp 2011
VCS - Version Control System at Security and Programming camp 2011 VCS - Version Control System at Security and Programming camp 2011
VCS - Version Control System at Security and Programming camp 2011
 

Similar a AndroidとSVG (ABC 2013 Spring LT) (6)

Shiny-Serverあれこれ
Shiny-ServerあれこれShiny-Serverあれこれ
Shiny-Serverあれこれ
 
I want Make full svg website
I want Make full svg websiteI want Make full svg website
I want Make full svg website
 
Jaws長崎
Jaws長崎Jaws長崎
Jaws長崎
 
メンテナブルなJsってなんだろう
メンテナブルなJsってなんだろうメンテナブルなJsってなんだろう
メンテナブルなJsってなんだろう
 
使う前に知っておきたいSVGのこと
使う前に知っておきたいSVGのこと使う前に知っておきたいSVGのこと
使う前に知っておきたいSVGのこと
 
超初心者でもできた!AzureMobileService JSバージョン
超初心者でもできた!AzureMobileService JSバージョン超初心者でもできた!AzureMobileService JSバージョン
超初心者でもできた!AzureMobileService JSバージョン
 

AndroidとSVG (ABC 2013 Spring LT)