Xamarin.formsとカスタムコントロールの話
•Transferir como PPTX, PDF•
5 gostaram•2,322 visualizações
第2回 Japan Xamarin User Group Conference 東日本編 2014/11/22 の発表スライドです。 Xamarin.Forms の概要と拡張（カスタムコントロール、DependencyService、カスタムレンダラ）
Recomendados
Mais conteúdo relacionado
Mais procurados
Mais procurados (20)
Semelhante a Xamarin.formsとカスタムコントロールの話
Semelhante a Xamarin.formsとカスタムコントロールの話 (20)
Último
Último (11)
Xamarin.formsとカスタムコントロールの話
- 1. Xamarin.Formsの概要と カスタムコントロール Microsoft MVP C# 増田智明 Moonmile Solutions
- 2. 自己紹介 増田智明masdua@moonmile.net 執筆業＆プログラマ C#によるiOS, Android, Windowsアプリケーション開発入門 逆引き大全Visual C# 2013, Visual Basic 2013 逆引き大全iPhone/iPad アプリ開発 作って覚えるiPhone/iPad アプリ入門
- 3. アジェンダ Xamarin.Forms とは何か？ 何故Xamarin.Forms を使うのか？ MS-XAML とは何か？ Xamarin.Froms の弱点 Xamarin.Forms を拡張する手法
- 5. Xamarin.Forms とは何か？ iPhone, Android, Windows Phone の3機種のUI を同時に作れるライ ブラリ ひとつのXAML で同時に3機種に 対応できる
- 6. Xamarin.Forms とは何か？ Visual Studio あるいはXamarin Studio でコードで書く。 Visual Studio あるいはXamarin Studio でXAML を書く。 XAML デザイナのようなものはな い
- 7. Xamarin.iOS/Android の共通部品 Pages Layouts Views Cells
- 9. 何故Xamarin.Forms を使うのか？ ひとつのUI で複数プラットフォームに対応 対応UI がひとつであれば、Xamarin.iOS/Android を選択 共通ライブラリであれば、PCL やShared Project を使う UI にXAML フォーマットを使う MS-XAML 互換のフォーマット
- 10. Xamarin.iOS/Android/Windows Phone Xamarin PCL or Shared Xamarin.Android axml Xamarin.iOS Storyboard(xml) Windows Phone XAML Android iOS Windows Phone ロジックをPCL or Shared で書くそれぞれのUI を書く
- 11. Xamarin.Formsのレンダリング 2014年5月末de:code の前日に発表 Xamarin-XAML XAML or Code ContentPage PCL or Shared Android AndroidActivity.SetPage iOS Page. CreateViewController Windows Phone Page.ConvertPageToUIElement XAML 解釈とUI のレンダリングが 異なる場所にある
- 12. Xamarin.Forms のXAML とは？ MS-XAML 規格 XAML 構文の詳細 MS-XAML Microsoft Domain-Specific Languages WPF やSliverlight など各種規格がある XAML for Xamarin.Forms MS-XAML 規格に則る XAML Markup Extensions Data Binding to MVVM
- 13. XAMLの条件 マークアップ拡張 x:Name で名前付け x:Class でコードとの対応付け データバインディング <TagName Text=“{Binding Name}” が有効 ドット付きのタグ名 Grid.Row などのドット付きのタグ名を有効にする WinStore-XAML XAML よって、各種部品の名前は異なるがXamarin.Forms はXAML である。 TextBlock など Xamarin-XAML Label など
- 15. Xamarin.Forms の弱点 3 機種の共通部分しか提供されない レンダラー時に、各プラットフォー ムの共通コントロールに置き換えら れるため デバイス依存の部品は提供されない カメラ機能、GPS、マップなど iOS Android Windows Phone Xamarin.Forms
- 16. デザイナがない 現状、Xamarin.Forms はコードで書くか、 XAML を直書きするか。 スマートフォンの場合は、StackLayout で十 分だが、タブレットになるとデザイナ無し では難しくなる。 Xamarin Sketches を利用する Xamarin Sketches Mac のみ、現在ベータ版 Xamarin.Forms Preview を自作中 （ちょっと頓挫）by moonmile
- 18. 拡張する手法 既存のコントロールを組み合わせる DependencyService を使う カスタムレンダラを使う
- 19. 既存コントロールの組み合わせ Windows ストアアプリのようにユーザコントロールを作る 1. *.xaml ファイルを作る 2. コントロールを並べる 3. コードビハイドで独自コードを書く 4. clr-namespace でインクルード xmlns:cc="clr-namespace:XamarinMyCustom.Views;assembly=XamarinMyCustom“ 5. 作成したコントロールを配置 <cc:CustomButton />
- 20. 既存コントロールの組み合わせ カスタムコントロール 既存コントロール 既存コントロール 既存コントロール XAML iOS Android Windows Phone
- 21. DependencyService を使う インターフェースを利用した委譲/Listenerパターン 1. PCL にインターフェースを作る public interface IDependencyCalc … 2. 内部動作をiOS/Android/Windows Phone 側で実装する [assembly: Dependency(typeof(DependencyCalcImpl))] class DependencyCalcImpl : IDependencyCalc 3. PCL 側でDependencyService.Get<...> で呼び出し _dep = DependencyService.Get<IDependencyCalc>();
- 22. DependencyService Portalbe Class Library Interface IDependencyCalc iOS Android Windows Phone Implement DependencyCalc DependencyService .Get<> Implement DependencyCalc Implement DependencyCalc
- 23. カスタムレンダラを使う 表示/動作のみ機種依存させる 1. PCL に空のコントロールを作る（実は空でなくてもよい） public class MyEntry : Entry 2. 内部動作をiOS/Android/Windows Phone 側で実装する [assembly: ExportRenderer(typeof(MyEntry), typeof(MyEntryRenderer))] public class MyEntryRenderer : EntryRenderer { protected override void OnElementChanged(ElementChangedEventArgs<Entry> e) { 3. PLC でXAML に配置する xmlns:cc=“clr-namespace:XamarinMyCustom.Views;assembly=XamarinMyCustom” <cc:MyEntry x:Name="myentry" Text="Sample" />
- 24. カスタムレンダラを使う XAML Portalbe Class Library class MyEntry iOS Android Windows Phone EntryRenderer OnElementChanged MyEntry 描画 EntryRenderer OnElementChanged EntryRenderer OnElementChanged
- 25. 使い分け ユーザコントロール方式カスタムレンダラ方式 Xamarin.Forms 機種依存 カメラ、画像描画、マップ など UI 以外 DependencyService方式 他に、Xamarin.Forms.Labs やリフレクション方式がある
- 26. 参考文献 英語 3. XAML Markup Extensions Accessing Native Features via the DependencyService Customizing Controls for Each Platform Creating Mobile Apps with Xamarin.Forms, Preview Edition (Developer Reference) Kindel 版 日本語 Xamarin.Formsの基本構想と仕組み Xamarin.Forms でユーザーコントロール的なView を作る Xamarin.Formsからプラットフォーム固有の機能を利用するには？（DependencyService利用） Xamarin.Formsでカメラを使う– Android編 Xamarin.Forms 「付箋紙を張るやつ」を作ってみた（画面構成） MS-XAML XAML 構文の詳細 Microsoft Domain-Specific Languages