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 概要

417 views

Published on

2017年9月8日開催
仙台・宮城とれたてネタ1【タガヤス その1】
#タガヤス

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Xamarin 概要

  1. 1. Xamarin 概要 福地雅之 グレープシティ株式会社 2017.9.8開催:仙台・宮城とれたてネタ!【タガヤス その1】
  2. 2. Introduction  福地雅之 [Masayuki FUKUCHI]  仙台市泉区在住  勤務先:グレープシティ株式会社(泉区紫山)
  3. 3. 業務 アプリケーション 開発支援ツール関連
  4. 4. お伝えしたい こと  Xamarin(ザマリン)概要  クロスプラットフォームモバイルアプリ開発
  5. 5. Xamarin  Xamarin(ザマリン) Xamarin社が開発→2016年にMicrosoftに買収  Android、iOS、Windows ”ネイティブ”モバイルアプリ を開発するフレームワークとその関連ツール ※今回解説するのはアプリ開発環境部分
  6. 6. Xamarin Platforms Xamarinのアプリ開発方法 プラットフォーム(iOS、Android、macOS)のAPIを提供する ラッパーのようなものとして利用 2種類のアプローチ  Xamarin Native(Xamarin.Android、Xamarin.iOS、Xamarin.Mac…)  プラットフォーム個別OS毎にUIを開発し、処理を共通化  ネイティブ開発(Android StudioやXcode)と同様の開発を実現  Xamarin.Forms  iOS/Android/WindowsのUIと処理を共通化  ワンソースで複数のプラットフォームアプリ開発を実現 C#でアプリ開発
  7. 7. Xamarin Native ビジネスロジックはC#でコードを共通化できる UI開発にはOS独自の知識と手法が必要 デバイス機能を利用するアプリ向き 通常のネイティブ開発の代替えとしても利用(C#で開発) Xamarin.iOS Xamarin.Android ビジネスロジック共通化 iOS UI Android UI Windows UI iOS API Android API Windows 10 UWP
  8. 8. Xamarin.Forms Xamarin.Formsを利用し処理だけでなくUIも共通化 XAMLを利用したUI設計が可能 クロスプラットフォームアプリ開発向き Xamarin.iOS Xamarin.Android ビジネスロジック共通化 iOS API Android API Windows 10 UWP Xamarin.Forms UI共通化
  9. 9. Visual Studio Visual Studioを利用した開発  開発可能なアプリ  Xamarin.Forms(Android、iOS、UWP)  Xamarin.Android(Android)  Xamarin.iOS(iOS – Watch、tvOS)
  10. 10. Visual Studio macOSの環境ではVisual Studio for Macを利用  開発可能なアプリ  Xamarin.Forms(Android、iOS、UWP)  Xamarin.Android(Android)  Xamarin.iOS(iOS – Watch、tvOS)  Xamarin.Mac(macOS)
  11. 11. Demo Xamarin.Android でHelloWorld ・Android アプリをC#で開発
  12. 12. import android.support.v7.app.AppCompatActivity; // 略 public class MainActivity extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); Button btn = (Button) findViewById(R.id.button1); btn.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { TextView txt = (TextView) findViewById(R.id.textView1); txt.setText("こんにちは Android"); } }); } } using Android.App; using Android.Widget; using Android.OS; namespace XA_HelloWorld { [Activity(Label = "XA_HelloWorld", MainLauncher = true)] public class MainActivity : Activity { protected override void OnCreate(Bundle savedInstanceState) { base.OnCreate(savedInstanceState); SetContentView(Resource.Layout.Main); Button btn = FindViewById((Resource.Id.button1)) as Button; btn.Click += (object sender, System.EventArgs e) => { var mesText = FindViewById<TextView>(Resource.Id.textView1); mesText.Text = "こんにちは Xamarin.Android"; }; } } } Android Studio Java Xamarin.Android C#
  13. 13. <?xml version=“1.0” encoding=“utf-8”?> <LinearLayout xmlns:android=“http://schemas.android.com/apk/res/android” android:orientation=“vertical” android:layout_width=“match_parent” android:layout_height=“match_parent”> <TextView android:text=“Text” android:layout_width=“match_parent” android:layout_height=“wrap_content” android:id=“@+id/textView1” /> <Button android:text=“ボタン” android:layout_width=“match_parent” android:layout_height=“wrap_content” android:id="@+id/button1" /> </LinearLayout> <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:text="Text" android:layout_width="match_parent" android:layout_height="wrap_content" android:id="@+id/textView1"/> <Button android:text="ボタン" android:layout_width="match_parent" android:layout_height="wrap_content" android:id="@+id/button1" /> </LinearLayout> レイアウト定義は同様 レイアウト定義は同様
  14. 14. Demo Xamarin.iOS でHelloWorld ・iOS アプリをC#で開発
  15. 15. import UIKit class ViewController: UIViewController { override func viewDidLoad() { super.viewDidLoad() } @IBOutlet weak var Label1: UILabel! @IBAction func button_touch(_ sender: Any) { Label1.text = "こんにちは Xcode iOS" } override func didReceiveMemoryWarning() { super.didReceiveMemoryWarning() } } using System; using UIKit; namespace XI_HelloWorld { public partial class ViewController : UIViewController { public ViewController(IntPtr handle) : base(handle){ } public override void ViewDidLoad() { base.ViewDidLoad(); Button1.TouchUpInside += Button1_TouchUpInside; } private void Button1_TouchUpInside(object sender, EventArgs e) { Label1.Text = "こんにちは Xamarin.iOS"; } public override void DidReceiveMemoryWarning() { base.DidReceiveMemoryWarning(); } } } Xcode Swift Xamarin.iOS C#
  16. 16. 同じようにStoryboardを編集
  17. 17. Demo Xamarin.Forms でHelloWorld ・Android/iOS/UWP アプリをC#で開発
  18. 18. <?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:XF_HelloWorld" x:Class="XF_HelloWorld.MainPage"> <StackLayout Orientation=“Vertical” VerticalOptions="Center"> <Label Text="Welcome to Xamarin Forms!" VerticalOptions="Center" HorizontalOptions="FillAndExpand“ HorizontalTextAlignment="Center" x:Name="Label1"/> <Button x:Name="Button1" Text="ボタン"/> </StackLayout> </ContentPage> Xamarin.Forms XAML using System; using Xamarin.Forms; namespace XF_HelloWorld { public partial class MainPage : ContentPage { public MainPage() { InitializeComponent(); Button1.Clicked += Button1_Clicked; } private void Button1_Clicked (object sender, EventArgs e) { Label1.Text = "こんにちは Xamarin.Forms"; } } } Xamarin.Forms C#
  19. 19. iOS Android Windows 10 UWP それぞれのプラットフォームに合った実行結果
  20. 20. Attention 【注意】 WindowsとVisual Studioだけでアプリ開発  誤解:XamarinアプリはWebView?  ハイブリッドではなくネイティブアプリ  誤解:Macが無くてもできる  iOSアプリのビルドにはmacOSが必要  誤解:C#が書ければOK  Android、iOSの各プラットフォームの知識が必要  誤解:Xamarin.Formsで完全に共通化  可能ではあるが最大公約数的ソリューション  UI共通化の是非  はやく、シンプルに開発する場合に最適
  21. 21. Visual Studio Visual Studioのインストールからスタート Visual Studio https://www.visualstudio.com/ja/
  22. 22. Try Xamarin 使ってみましょう 日本マイクロソフト https://www.microsoft.com/ja-jp/dev/campaign/vs-xamarin.aspx
  23. 23. Try Xamarin
  24. 24. Try Xamarin ユーザーグループなどに豊富な情報 Japan Xamarin User Group(#JXUG) http://jxug.org/
  25. 25. サンプル コード  サンプルデモのコード  Xamarin.Android  Xamarin.iOS  Xamarin.Forms Visual StudioまたはVisual Studio for Macで利用可能 https://github.com/fukuchima/Tagayas_201709
  26. 26. 良い開発ツールを 使っていきましょう

×