1

インフラジスティックスおよびXamarin.Forms

コントロールのご紹介

2

自己紹介

池原 大然

インフラジスティックス・ジャパン株式会社

製品担当

dikehara@infragistics.com

Microsoft MVP for Windows Platform Development

Twitter: @Neri78

Blog: http://blogs.jp.infragistics.com/blogs/dikehara

3

アジェンダ

会社紹介並びに開発ツール製品概要

Infragistics Xamarin.Forms 概要

Infragistics Xamarin.Forms を利用した

モバイル アプリケーション開発

まとめ・リソース

4

会社紹介並びに開発ツール製品概要

開発方針

製品リリースサイクル

製品メンテナンス

提供製品・プラットフォーム

5

会社概要

社名 Infragistics Japan Co., Ltd.インフラジスティックス・ジャパン株式会社

設立 2006 年 8 月

代表取締役 東 賢

所在地 東京都渋谷区渋谷 1-20-1 井門美竹ビル 2F

電話番号 03-6892-8034

米国本社 Infragistics, Inc.1989 年創業、2000 年 ProtoViewDevelopment Corporation、Sheridan Software Systems, Inc. の合併により設立

6

1996 年 ~ 2010 年

日本市場における歩み - 1

1996 年

•代理店経由で日本市場

での製品販売を開始

• OCX, VBX コント

ロール

2003 年

•開発コンポーネント

スイート

NetAdvantage

シリーズの販売を開始

2006 年

•日本市場における更な

る販売、サポートの強

化のためににインフラ

ジスティックス・ジャ

パン株式会社を設立

•電話サポート、優先サ

ポートの提供を開始

2007 年 – 2010 年

• WPF、Silverlight な

どマイクロソフト プ

ラットフォームに対応

した製品を市場でいち

早く提供開始

•プロフェッショナル

サービスの提供を開始

7

2011 年 ~ 2014 年

日本市場における歩み – 2

2011 年

• HTML5/jQuery など

のマイクロソフト プ

ラットフォーム以外に

対応した UI コント

ロール製品の提供を開

始モバイル、タブレッ

ト、Web 環境に対応し

た製品の提供を開始

2012 年

• iOS 対応コントロール

の提供を開始

• SharePoint モバイル

アクセスやデータ視覚

化を実現するエンター

プライズモビリティ

ソリューションの提供

を日本市場で開始

2013 年

•開発ツール製品の

ブランド名を

NetAdvantage か

ら社名である、

Infragistics へと

変更

2014 年

•テストスイートである、HP

Unified Functional

Testing (UFT)、IBM

Rational Functional

Tester (RFT) に対応した

デスクトップ コントロール

テストツールの提供を日本

市場で提供開始

8

インフラジスティックス・ジャパンの担当地域

日本を含むアジア太平洋地域を担当

9

開発ツール

エンタープライズ モビリティ

プロフェッショナル サービス

事業内容

10

統合開発コンポーネント スイートInfragistics Ultimate

生産性 ユーザビリティ 信頼性

11

インフラジスティックスがお届けするもの

高い生産性の実現

12

1. 圧倒的に「機能」が豊富

2. 最初から高度なパフォーマンス チューニング済み

3. ビジュアル デザインを独立して設定Q

１．圧倒的に「機能」が豊富(開発工数を大幅に削減できる)

２．最初から高度なパフォーマンスチューニング済み(非機能要件を高めるための開発コストを抑制できる)

３．ビジュアルデザインを独立して設定プリセットのスタイルも多数用意

開発ツールにおける「高い生産性の実現」とは？

全ては多様化するユーザーニーズに応えるための取り組み

13

Infragistics Ultimate に含まれる製品

Windows Forms ASP.NET WPF Silverlight

Ignite UI

(HTML5/jQuery/

ASP.NET MVC)

NucliOS

(iOS)

Android

(Java) - CTPXamarin.Forms

IconIndigo

Studio

UWP

(Future)

14

Windows Forms

ASP.NET

WPF

Silverlight

Ignite UI (HTML5/jQuery/AS

P.NET MVC)

NucliOS(iOS/Xamarin.iOS) Icon

Indigo StudioAndroid (CTP)

Xamarin.Forms

カテゴリ別デスクトップ向け Web 向け タブレット・モバイル 向け デザイン ツール

UWP(Future)

15

「コード共有」と「翻訳」

コア API を各プラットフォームに

「共有」、「翻訳」

類似の機能セットを複数の

プラットフォームで提供

個々のプラットフォームに合わせた

様々なチューニング

パフォーマンス重視

15

Core

API

Xamarin

Forms

WPF

HTML5

iOS

Android

Windows

Universal

Windows

Phone

16

データ視覚化 UI

17

コントロールの活用と UI へのニーズ

1 「コントロール」では実現が難しい UI

(一品もの、そのものが差別化要因となる)

2 大型のコントロールを利用した多目的機能

3 よくある業務要件を満たすための UI

4 標準コントロールで実現できる範囲の UI

実現難易度

弊社開発ツール製品は主に 2, 3 を対象にしたコントロールを提供

18

Infragistics Xamarin.Forms 概要

19

iOS

Objective-C/Swift

Xcode

Android

Java

Eclipse

Windows

C#

Visual Studio

Xamarin (C#)Xamarin Studio / Visual Studio

Xamarin.Forms

Xamarin.Forms (共有 UI コード)

2020

Infragistics Xamarin.Forms

Xamarin.Forms 対応コントロール

2015 Vol.1 ではデータ視覚化コントロールを中心に提供

• チャート• ゲージ• バーコード (CTP)• グリッド (CTP)

21

サポート環境

2015 Vol.1 でのサポート環境

• 詳細については http://jp.infragistics.com/support/supported-environments または弊社サポートにお問い合わせください。

Xamarin.Forms 1.3.5.6335

開発環境 Visual Studio 2012、2013、Xamarin Studio

開発言語 C#

対応端末 Android 4.3 以降iOS 8.0 以降Windows Phone 8.0 以降

22

「コード共有」と「翻訳」 コア API を各プラットフォームに

「共有」、「翻訳」

類似の機能セットを複数の

プラットフォームで提供

個々のプラットフォームに合わせた

様々なチューニング

パフォーマンス重視

Core

API

Xamarin

Forms

WPF

HTML5

iOS

Android

Windows

Universal

Windows

Phone

Xamarin.Forms ではこの仕組みをフル活用

23

Xamarin.Forms のサンプルは

製品と共にインストールされる

%public%¥documents¥Infragistics¥

2015.1¥Xamarin¥Apps

もしくは HP からソースコードをダウンロード

http://jp.infragistics.com/sample-applications

Xamarin.Forms コントロールで作成されたアプリケーション

24

Demo Xamarin.Forms コントロールを利用した

アプリケーションサンプル

25

データ チャート

XFDataChart

RTM

柱状、棒、ライン、スプライン

箱ひげなど基本的なチャート

CTP機能 ラジアル,ポーラー

日付軸

注釈レイヤー

アニメーション トランジション

26

円チャート

XFPieChart

「その他」の表示

要素の選択

強調表示

27

ゲージ・ブレットグラフ

XFLinearGauge/XFRadialGauge/XFBulletGraph

ラジアル/リニア

針

範囲

スケール

アニメーション

トランジション

28

バーコード - CTP

XFBarcode128

128 ASCII

29

データ グリッド – CTP

XFDataGrid

列の自動生成

自動、固定サイズ列

テンプレート列

グループ化

データ アダプター

テキスト列

30

Infragistics Xamarin.Forms を利用したモバイル アプリケーション開発

提供コントロールの種類

ページへのコントロールの追加と設定

31

プロジェクトの作成

Visual C# -

Mobile Apps から

テンプレートを

選択

32

Xamarin.Forms の典型的なソリューション

4 つのプロジェクト

共通プロジェクト

• 共通 UI 部もこちらで構築

Android

iOS

Windows Phone

32

33

(重要) Android プロジェクトのヒープ設定

インフラジスティックス コントロールを

利用する場合はヒープ サイズを

1G に設定

[Advanced Options] – [Advanced]

34

ページへのコントロールの追加

全ての関連プロジェクトに個々のコントロールに対応した

アセンブリ参照を追加

ローカル NuGet パッケージを利用することで簡易に参照を追加できる。

35

Visual Studio で NuGet パッケージを指定

[ツール] – [オプション] – [NuGet パッケージ マネージャー]

36

必要パッケージの読み込み

37

Demo アセンブリの参照と各種プロジェクト設定

38

名前空間の追加

XAML で利用する場合、インフラジスティックス

コントロールの名前空間を宣言する必要がある

全てを宣言する必要はない

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"

39

XAML を利用した UI の設定

39

<?xml version="1.0" encoding="utf-8" ?>

<ContentPage xmlns=http://xamarin.com/schemas/2014/forms

xmlns:x=http://schemas.microsoft.com/winfx/2009/xamlxmlns: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>

40

アセンブリの初期化

各プラットフォーム用のプロジェクトで利用しているアセンブリの

初期化を呼び出す必要がある

iOS – AppDelegate.cs

Android – MainActivity.cs

Windows Phone – MainPage.xaml.cs

こちらも利用しているコントロールのみ

Infragistics.XF.Initializers.Barcodes.Init();

Infragistics.XF.Initializers.Charts.Init();

Infragistics.XF.Initializers.Gauges.Init();

Infragistics.XF.Initializers.Grids.Init();

41

Demo Infragistics Xamarin.Forms を使用した

チャート アプリケーションの構築

42

ドキュメンテーション

http://jp.infragistics.com/support/online-documentation

既存コントロール同様にチュートリアル、API 情報を記載

ツリーを「展開」

42

日本語ドキュメントを準備中

43

Demo Infragistics Ultimate を利用した

他プラットフォームとのコード・ナレッジ共有

Core

API

Xamarin

Forms

WPF

HTML5

iOS

Android

Windows

Universal

Windows

Phone

44

まとめ・リソース

45

Xamarin.Forms 対応コントロール

基本的な利用方法は Xamarin.Forms に準拠

コード「共有」、「翻訳」を行っているため、

他プラットフォームへの・からのナレッジ移行が可能

WPF, Silverlight, HTML/jQuery, そして Universal

Windows Application (将来)

今後コントロールを拡充予定45

46

リソース 製品ページ

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

47

ぜひお試しください!

http://jp.infragistics.com/xamarin-forms

47

48