Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
インフラジスティックスおよび
Xamarin.Forms
コントロールのご紹介
インフラジスティックス・ジャパン株式会社
製品担当
池原 大然
自己紹介
• 池原 大然
• インフラジスティックス・ジャパン株式会社
製品担当
• Microsoft MVP for Windows Platform Development
• UI 全般の技術についてウォッチしています。
• Twitt...
本日のアジェンダ
•インフラジスティックス開発ツール概要
•Infragistics Xamarin.Forms 概要
•Infragistics Xamarin.Forms を利用した
モバイル アプリケーション開発
•まとめ
•リソース
C...
4
インフラジスティックス
開発ツール概要
 開発方針
 製品リリースサイクル
 製品メンテナンス
 提供製品・プラットフォーム
Copyright 2015 Infragistics Japan Co., Ltd.
開発コンポーネント スイート
Infragistics Ultimate
• 生産性
• ユーザビリティ
• 信頼性
Copyright 2015 Infragistics Japan Co., Ltd. 5
生産性 ユーザビリティ 信頼性
Windows Forms ASP.NET WPF Silverlight
Ignite UI
(HTML5/jQuery/ASP.
NET MVC)
NucliOS
(iOS/Xamarin.i
OS)
Windows UI
(Windows...
9
Windows Phone
Windows Phone 対応コントロール
WPF/Silverlight/Windows UI で提供しているデータ視覚化パターンを
実装
Copyright 2015 Infragistics Japan ...
10
NucliOS (iOS)
iOS 対応コントロール
Objective-C、Xamarin.iOS をサポート
Copyright 2015 Infragistics Japan Co., Ltd.
• チャート
• グリッド
• ゲー...
11
Android
Android 対応コントロール
Java で開発できる Android 専用ネイティブ コントロール
Copyright 2015 Infragistics Japan Co., Ltd.
• グリッド
• ゲージ
• ...
「コード共有」と「翻訳」
• コア API を各プラット
フォームに「翻訳」
• 個々のプラットフォームに合
わせて API を
チューニング
• クロスプラットフォームかつ
パフォーマンス重視
• 類似の機能セット
Copyright 201...
13
Infragistics Xamarin.Forms 概要
 概要
 提供コントロール一覧
Copyright 2015 Infragistics Japan Co., Ltd.
iOS
Objective-C/Swift
Xcode
Android
Java
Eclipse
Windows
C#
Visual Studio
Xamarin (C#)
Xamarin Studio / Visual Studio
Xama...
15
概要
Xamarin.Forms 対応コントロール
NucliOS/Windows Phone/Android それぞれで提供している
共通コントロールを提供
Copyright 2015 Infragistics Japan Co., ...
サポート環境
• 2015 Vol.1 でのサポート環境
Copyright 2015 Infragistics Japan Co., Ltd. 16
• 詳細については http://jp.infragistics.com/support/s...
「コード共有」と「翻訳」
• コア API を各プラット
フォームに「翻訳」
• 個々のプラットフォームに
合わせて API を
チューニング
• クロスプラットフォームか
つパフォーマンス重視
• 類似の機能セット Copyright 201...
データ チャート
• XFDataChart
• RTM
• 柱状、棒、ライン、スプライン
• 箱ひげなど基本的なチャート
• CTP機能
 ラジアル,ポーラー
 日付軸
 注釈レイヤー
 アニメーション トランジション
Copyrig...
円チャート
•XFPieChart
• 「その他」の表示
• 要素の選択
• 強調表示
Copyright 2015 Infragistics Japan Co., Ltd. 19
ゲージ・ブレットグラフ
• XFLinearGauge/XFRadialGauge/XFBulletGraph
• ラジアル/リニア
• 針
• 範囲
• スケール
• アニメーション
トランジション
Copyright 2015 Infrag...
データ グリッド – CTP
• XFDataGrid
• 列の自動生成
• 自動、固定サイズ列
• テンプレート列
• グループ化
• データ アダプター
• テキスト列
Copyright 2015 Infragistics Japan C...
バーコード - CTP
•XFBarcode128
•128 ASCII
Copyright 2015 Infragistics Japan Co., Ltd. 22
アプリケーション サンプル
• Xamarin.Forms のサンプルは製品と共にインストールされる
• パブリックのドキュメント¥Infragistics¥2015.1¥Xamarin¥Apps
• もしくは HP からソースコードをダウンロ...
24
Demo
 Xamarin.Forms を利用したアプリケーションサンプル
Copyright 2015 Infragistics Japan Co., Ltd.
25
Infragistics Xamarin.Forms を利用した
モバイル アプリケーション開発
 コントロール サンプル
 ページへのコントロールの追加と設定
Copyright 2015 Infragistics Japan Co...
Visual Studio を利用して作成
• Visual C# -
Mobile Apps から
テンプレートを
選択
Copyright 2015 Infragistics Japan Co., Ltd. 26
Xamarin.Forms の典型的なソリューション
•4 つのプロジェクト
• プラットフォーム共通部
• 共通 UI 部もこちらで構築
• Android
• iOS
• Windows Phone
Copyright 2015 Infra...
28
Android プロジェクトのヒープ設定
• インフラジスティックス コントロール
を利用する場合はヒープ サイズを
1G に設定
• [Advanced Options] – [Advanced]
Copyright 2015 Infr...
ページへのコントロールの追加
• 全ての関連プロジェクトに個々のコントロールに対応した
アセンブリ参照を追加
• ローカル NuGet パッケージを利用することで簡易に参照を追加できる。
Copyright 2015 Infragistics ...
Visual Studio で NuGet パッケージを指定
• [ツール] – [オプション] – [NuGet パッケージ マネージャー]
Copyright 2015 Infragistics Japan Co., Ltd. 30
必要パッケージの読み込み
Copyright 2015 Infragistics Japan Co., Ltd. 31
32
Demo
 アセンブリの参照と各種プロジェクト設定
Copyright 2015 Infragistics Japan Co., Ltd.
名前空間の追加
• XAML で利用する場合、インフラジスティックス
コントロールの名前空間を宣言する必要がある
• 全てを宣言する必要はない
Copyright 2015 Infragistics Japan Co., Ltd. 33
xml...
XAML の設定
Copyright 2015 Infragistics Japan Co., Ltd. 34
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns=http://...
アセンブリの初期化
• 各プラットフォーム用のプロジェクトで利用しているアセンブリの
初期化を呼び出す必要がある
• こちらも利用しているコントロールのみ
Copyright 2015 Infragistics Japan Co., Ltd. ...
36
Demo
 Infragistics Xamarin.Forms の使用
Copyright 2015 Infragistics Japan Co., Ltd.
ドキュメンテーション
• http://jp.infragistics.com/support/online-documentation
• 既存コントロール同様にチュートリアル、API 情報を記載
• ツリーを「展開」
Copyright 2...
38
Demo
 他プラットフォームとの類似性
Copyright 2015 Infragistics Japan Co., Ltd.
Core
API
Xamarin
Forms
WPF
HTML5
iOS
Android
Windows
...
39
まとめ
Copyright 2015 Infragistics Japan Co., Ltd.
Xamarin.Forms 対応コントロール
• 基本的な利用方法は Xamarin.Forms に準拠
• コード「共有」、「翻訳」コントロールを利用しているため、
「何」が提供されているかを把握しやすい
• 今後拡充予定
Copyright...
41
リソース
Copyright 2015 Infragistics Japan Co., Ltd.
リソース
• 製品ページ
http://jp.infragistics.com/products/xamarin-forms
• サンプルページ
http://jp.infragistics.com/sample-applications
• ...
ぜひお試しください!
• http://jp.infragistics.com/xamarin-forms
Copyright 2015 Infragistics Japan Co., Ltd. 43
Copyright 2015 Infragistics Japan Co., Ltd.
Upcoming SlideShare
Loading in …5
×

インフラジスティックスおよび Xamarin.forms コントロールのご紹介

143 views

Published on

2015 年 07 月 08 日に XLsoft 様と共催でモバイル セミナーを行わせていただきました際に利用したスライドです。

Published in: Social Media
  • Be the first to comment

  • Be the first to like this

インフラジスティックスおよび Xamarin.forms コントロールのご紹介

  1. 1. インフラジスティックスおよび Xamarin.Forms コントロールのご紹介 インフラジスティックス・ジャパン株式会社 製品担当 池原 大然
  2. 2. 自己紹介 • 池原 大然 • インフラジスティックス・ジャパン株式会社 製品担当 • Microsoft MVP for Windows Platform Development • UI 全般の技術についてウォッチしています。 • Twitter: @Neri78 • Blog: http://blogs.jp.infragistics.com/blogs/dikehara
  3. 3. 本日のアジェンダ •インフラジスティックス開発ツール概要 •Infragistics Xamarin.Forms 概要 •Infragistics Xamarin.Forms を利用した モバイル アプリケーション開発 •まとめ •リソース Copyright 2015 Infragistics Japan Co., Ltd. 3
  4. 4. 4 インフラジスティックス 開発ツール概要  開発方針  製品リリースサイクル  製品メンテナンス  提供製品・プラットフォーム Copyright 2015 Infragistics Japan Co., Ltd.
  5. 5. 開発コンポーネント スイート Infragistics Ultimate • 生産性 • ユーザビリティ • 信頼性 Copyright 2015 Infragistics Japan Co., Ltd. 5 生産性 ユーザビリティ 信頼性
  6. 6. Windows Forms ASP.NET WPF Silverlight Ignite UI (HTML5/jQuery/ASP. NET MVC) NucliOS (iOS/Xamarin.i OS) Windows UI (Windows Store Application) Windows Phone Icon Indigo Studio Android (CTP) Xamarin.Forms (RTM) Infragistics Ultimate 2015 Vol.1 に含まれる製品 Copyright 2015 Infragistics Japan Co., Ltd. 6
  7. 7. 9 Windows Phone Windows Phone 対応コントロール WPF/Silverlight/Windows UI で提供しているデータ視覚化パターンを 実装 Copyright 2015 Infragistics Japan Co., Ltd. • チャート • エディター • バーコード • ゲージ • インタラクション • レイアウト • メニュー & リスト
  8. 8. 10 NucliOS (iOS) iOS 対応コントロール Objective-C、Xamarin.iOS をサポート Copyright 2015 Infragistics Japan Co., Ltd. • チャート • グリッド • ゲージ • ウィジェット • Xamarin.iOS
  9. 9. 11 Android Android 対応コントロール Java で開発できる Android 専用ネイティブ コントロール Copyright 2015 Infragistics Japan Co., Ltd. • グリッド • ゲージ • バーコード • チャート • Xamarin.Android
  10. 10. 「コード共有」と「翻訳」 • コア API を各プラット フォームに「翻訳」 • 個々のプラットフォームに合 わせて API を チューニング • クロスプラットフォームかつ パフォーマンス重視 • 類似の機能セット Copyright 2015 Infragistics Japan Co., Ltd. 12 Core API Xamarin Forms WPF HTML5 iOS Android Windows Universal Windows Phone
  11. 11. 13 Infragistics Xamarin.Forms 概要  概要  提供コントロール一覧 Copyright 2015 Infragistics Japan Co., Ltd.
  12. 12. iOS Objective-C/Swift Xcode Android Java Eclipse Windows C# Visual Studio Xamarin (C#) Xamarin Studio / Visual Studio Xamarin.Forms Copyright 2015 Infragistics Japan Co., Ltd. 14 Xamarin.Forms (共有 UI コード)
  13. 13. 15 概要 Xamarin.Forms 対応コントロール NucliOS/Windows Phone/Android それぞれで提供している 共通コントロールを提供 Copyright 2015 Infragistics Japan Co., Ltd. • チャート • グリッド • バーコード • ゲージ
  14. 14. サポート環境 • 2015 Vol.1 でのサポート環境 Copyright 2015 Infragistics Japan Co., Ltd. 16 • 詳細については http://jp.infragistics.com/support/supported- environments または弊社サポートにお問い合わせください。 Xamarin.Forms 1.3.5.6335 開発環境 Visual Studio 2012、2013、Xamarin Studio 開発言語 C# 対応端末 Windows Phone 8.0 以降、Android 4.3 以降、 iOS 8.0 以降
  15. 15. 「コード共有」と「翻訳」 • コア API を各プラット フォームに「翻訳」 • 個々のプラットフォームに 合わせて API を チューニング • クロスプラットフォームか つパフォーマンス重視 • 類似の機能セット Copyright 2015 Infragistics Japan Co., Ltd. 17 Core API Xamarin Forms WPF HTML5 iOS Android Windows Universal Windows Phone Xamarin.Forms では この仕組みをフル活用
  16. 16. データ チャート • XFDataChart • RTM • 柱状、棒、ライン、スプライン • 箱ひげなど基本的なチャート • CTP機能  ラジアル,ポーラー  日付軸  注釈レイヤー  アニメーション トランジション Copyright 2015 Infragistics Japan Co., Ltd. 18
  17. 17. 円チャート •XFPieChart • 「その他」の表示 • 要素の選択 • 強調表示 Copyright 2015 Infragistics Japan Co., Ltd. 19
  18. 18. ゲージ・ブレットグラフ • XFLinearGauge/XFRadialGauge/XFBulletGraph • ラジアル/リニア • 針 • 範囲 • スケール • アニメーション トランジション Copyright 2015 Infragistics Japan Co., Ltd. 20
  19. 19. データ グリッド – CTP • XFDataGrid • 列の自動生成 • 自動、固定サイズ列 • テンプレート列 • グループ化 • データ アダプター • テキスト列 Copyright 2015 Infragistics Japan Co., Ltd. 21
  20. 20. バーコード - CTP •XFBarcode128 •128 ASCII Copyright 2015 Infragistics Japan Co., Ltd. 22
  21. 21. アプリケーション サンプル • Xamarin.Forms のサンプルは製品と共にインストールされる • パブリックのドキュメント¥Infragistics¥2015.1¥Xamarin¥Apps • もしくは HP からソースコードをダウンロード http://jp.infragistics.com/sample-applications Copyright 2015 Infragistics Japan Co., Ltd. 23
  22. 22. 24 Demo  Xamarin.Forms を利用したアプリケーションサンプル Copyright 2015 Infragistics Japan Co., Ltd.
  23. 23. 25 Infragistics Xamarin.Forms を利用した モバイル アプリケーション開発  コントロール サンプル  ページへのコントロールの追加と設定 Copyright 2015 Infragistics Japan Co., Ltd.
  24. 24. Visual Studio を利用して作成 • Visual C# - Mobile Apps から テンプレートを 選択 Copyright 2015 Infragistics Japan Co., Ltd. 26
  25. 25. Xamarin.Forms の典型的なソリューション •4 つのプロジェクト • プラットフォーム共通部 • 共通 UI 部もこちらで構築 • Android • iOS • Windows Phone Copyright 2015 Infragistics Japan Co., Ltd. 27
  26. 26. 28 Android プロジェクトのヒープ設定 • インフラジスティックス コントロール を利用する場合はヒープ サイズを 1G に設定 • [Advanced Options] – [Advanced] Copyright 2015 Infragistics Japan Co., Ltd.
  27. 27. ページへのコントロールの追加 • 全ての関連プロジェクトに個々のコントロールに対応した アセンブリ参照を追加 • ローカル NuGet パッケージを利用することで簡易に参照を追加できる。 Copyright 2015 Infragistics Japan Co., Ltd. 29
  28. 28. Visual Studio で NuGet パッケージを指定 • [ツール] – [オプション] – [NuGet パッケージ マネージャー] Copyright 2015 Infragistics Japan Co., Ltd. 30
  29. 29. 必要パッケージの読み込み Copyright 2015 Infragistics Japan Co., Ltd. 31
  30. 30. 32 Demo  アセンブリの参照と各種プロジェクト設定 Copyright 2015 Infragistics Japan Co., Ltd.
  31. 31. 名前空間の追加 • XAML で利用する場合、インフラジスティックス コントロールの名前空間を宣言する必要がある • 全てを宣言する必要はない Copyright 2015 Infragistics Japan Co., Ltd. 33 xmlns:igCodes="clr-namespace:Infragistics.XF.Controls;assembly=InfragisticsXF.Controls.Barcodes" xmlns:igCharts="clr-namespace:Infragistics.XF.Controls;assembly=InfragisticsXF.Controls.Charts" xmlns:igGauges="clr-namespace:Infragistics.XF.Controls;assembly=InfragisticsXF.Controls.Gauges" xmlns:igGrids="clr-namespace:Infragistics.XF.Controls;assembly=InfragisticsXF.Controls.Grids"
  32. 32. XAML の設定 Copyright 2015 Infragistics Japan Co., Ltd. 34 <?xml version="1.0" encoding="utf-8" ?> <ContentPage xmlns=http://xamarin.com/schemas/2014/forms xmlns:x=http://schemas.microsoft.com/winfx/2009/xaml xmlns:local="clr-namespace:XFDemo1;assembly=XFDemo1“ xmlns:igCharts=“clr-namespace:Infragistics.XF.Controls;assembly=InfragisticsXF.Controls.Charts“ x:Class=“XFDemo1.Page1”> <ContentPage.BindingContext> <!-- バインディング コンテキストを指定  <local:SimpleDataCollection /> </ContentPage.BindingContext> <igCharts:XFDataChart x:Name=“Chart” > <igCharts:XFDataChart.Axes> <!-- 軸  <igCharts:CategoryXAxis x:Name=“xAxis” ItemsSource=“{Binding}“ Label=“Label” /> <ig:NumericYAxis x:Name=“yAxis” /> </igCharts:XFDataChart.Axes> <igCharts:XFDataChart.Series> <!-- シリーズ --> <igCharts:AreaSeries ItemsSource="{Binding}“ ValueMemberPath="Value“ XAxis="{x:Reference xAxis}” YAxis="{x:Reference yAxis}"> </igCharts:AreaSeries> </igCharts:XFDataChart.Series> </igCharts:XFDataChart > </ContentPage>
  33. 33. アセンブリの初期化 • 各プラットフォーム用のプロジェクトで利用しているアセンブリの 初期化を呼び出す必要がある • こちらも利用しているコントロールのみ Copyright 2015 Infragistics Japan Co., Ltd. 35 Infragistics.XF.Initializers.Barcodes.Init(); Infragistics.XF.Initializers.Charts.Init(); Infragistics.XF.Initializers.Gauges.Init(); Infragistics.XF.Initializers.Grids.Init();
  34. 34. 36 Demo  Infragistics Xamarin.Forms の使用 Copyright 2015 Infragistics Japan Co., Ltd.
  35. 35. ドキュメンテーション • http://jp.infragistics.com/support/online-documentation • 既存コントロール同様にチュートリアル、API 情報を記載 • ツリーを「展開」 Copyright 2015 Infragistics Japan Co., Ltd. 37 日本語ドキュメントを準備中
  36. 36. 38 Demo  他プラットフォームとの類似性 Copyright 2015 Infragistics Japan Co., Ltd. Core API Xamarin Forms WPF HTML5 iOS Android Windows Universal Windows Phone
  37. 37. 39 まとめ Copyright 2015 Infragistics Japan Co., Ltd.
  38. 38. Xamarin.Forms 対応コントロール • 基本的な利用方法は Xamarin.Forms に準拠 • コード「共有」、「翻訳」コントロールを利用しているため、 「何」が提供されているかを把握しやすい • 今後拡充予定 Copyright 2015 Infragistics Japan Co., Ltd. 40
  39. 39. 41 リソース Copyright 2015 Infragistics Japan Co., Ltd.
  40. 40. リソース • 製品ページ http://jp.infragistics.com/products/xamarin-forms • サンプルページ http://jp.infragistics.com/sample-applications • ドキュメント http://jp.infragistics.com/support/online-documentation • Blog http://blogs.jp.infragistics.com/tags/XAML/default.aspx Copyright 2015 Infragistics Japan Co., Ltd. 42
  41. 41. ぜひお試しください! • http://jp.infragistics.com/xamarin-forms Copyright 2015 Infragistics Japan Co., Ltd. 43
  42. 42. Copyright 2015 Infragistics Japan Co., Ltd.

×