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 UPDATE情報からいろいろ。
Japan Xamarin Users Group
福田 拳士朗
2018/06/23 .NETラボ
@日本マイクロソフト株式会社
ABOUT ME
 福田 拳士朗 (ふくだ けんしろう)
 Twitter:@Kenshiro_Fukuda
 Facebook:Kenshiro.Fukuda.9
 Blog:https://t.co/GDpnCcdu8D
今日お話しすること
 Xamarinの基本的情報
 Xamarin最新情報(主にBuildであった話など)
 Xamarin.Forms 3.0
 Flex Layout
 With CSS
 Xamarin Workbooksにつ...
XAMARINの基本情報
 iOs・Android・UWP環境で動作するクロスプラットドームアプリ・会社名
 C#/.NET/Visual Studioの環境で利用でき、APIはフル利用、フルネイティブアプリ
 2013年にMSとパートナ...
XAMARIN関係の情報 @BUILD2018
 19セッション
 Adaptive Cardsが近日中にXamarinでも使えるようになる?(SDKまち)
 ※ Cardは、SNSでよく見るやつを考えてくれればOK。
 2018年のS...
XAMARIN.FORMS 3.0正式版リリース
 FlexLayoutのサポート
 ResourceDictionaryの改善
 Right to Left Support
 CSSサポート
 Visual State Manage...
FLEX LAYOUTとCSSのサポート
 CSS に基づくもので、フレキシブル ボックス レイアウト モジュールと呼ばれる、いわゆるを子を整
列する多くの柔軟なオプションが含まれているレイアウト
 FlexLayoutはLayout <V...
FLEXLAYOUTソース解読
 まずはCSSでおさらい
FLEXLAYOUTソース解読
<FlexLayout Direction="Column" AlignItems="Center" JustifyContent="SpaceEvenly">
<Label Text="FlexLayout i...
FLEXLAYOUTソース解読
CSSとの組み合わせは??
 デモプログラム( https://docs.microsoft.com/ja-jp/xamarin/xamarin-forms/user-
interface/layouts/flex-layout#css-st...
DO YOU KNOW 「XAMARIN WORKBOOKS」?
Visual studio 2017でXamarin関係をインストールすると勝手に入ってきたやつで
すねw
今回は、あまり目が当てられてないこのツールについて少し研究していければ...
ABOUT XAMARIN WORKBOOKS
 ドキュメント+LIVE コーディングの概念を載せたもの
 開発者はこのアプリで利用できるファイルを読み進めて学習をすることができる
 可変が可能
 Android・iOs・Mac・WPF...
作業風景
せっかくなのでドキュメントを読む
 チュートリアルで使い方がわかりやすくなっている。
XAMARIN 今後は・・・?
 FORMSは6週ごとで何かしらの機能追加を行っている
 次の機能追加は8月に
ドキュメンテーション統合化に向けて
 既に一部の機能を移行しているが、今回本格的な移行となったのは下記の通り。
 Xamarinドキュメント(docs.Microsoft.com/xamarin)
→日本語化してあり、Formsに関してもす...
WINDOWS 10のSDK対応させ続けるためにとった話
 ついに全PCVS2017への移行となった・・・
(SDK入れるだけのUpdateには問題はないんだけど・・・)
 つまずいたところはWindows 10のVersion1709から...
FLUTTERについて
 Googleのオープンソースツールで、iOs・Androidのモバイルアプリが書ける
 Dart言語を利用。
 Flutter SDKのDL・Andrid Studioのインストールが必要
 Android S...
まとめ
 Xamarin.Forms 3.0での新サポート
 Flex Layoutでレイアウトの可能性を広げる
 CSSサポートでデザイナーにおけるCSSコーディングの幅が広がる
 Xamarin Workbooksについて
 紙の...
最後に~アプリ製作について
 アプリ概要:BVE日本線 運転支援アプリ
 Project Site:未公開(公開され次第お知らせいたします)
 Github:https://github.com/TOBU66601/BVETimetabl...
参考URL
 https://docs.microsoft.com/ja-jp/xamarin/android/get-started/installation/android-
emulator/hardware-acceleration?...
ご清聴ありがとうございました。
Upcoming SlideShare
Loading in …5
×

2018/06/24 .NETラボ Xamarinトーク

474 views

Published on

2018年6月24日に発表したスライドです。
Formsよりなのはご了承ください・・・

Published in: Technology
  • Be the first to comment

  • Be the first to like this

2018/06/24 .NETラボ Xamarinトーク

  1. 1. XAMARIN UPDATE情報からいろいろ。 Japan Xamarin Users Group 福田 拳士朗 2018/06/23 .NETラボ @日本マイクロソフト株式会社
  2. 2. ABOUT ME  福田 拳士朗 (ふくだ けんしろう)  Twitter:@Kenshiro_Fukuda  Facebook:Kenshiro.Fukuda.9  Blog:https://t.co/GDpnCcdu8D
  3. 3. 今日お話しすること  Xamarinの基本的情報  Xamarin最新情報(主にBuildであった話など)  Xamarin.Forms 3.0  Flex Layout  With CSS  Xamarin Workbooksについて  その他  Xamarinの将来は?  競合ツールは・・・?
  4. 4. XAMARINの基本情報  iOs・Android・UWP環境で動作するクロスプラットドームアプリ・会社名  C#/.NET/Visual Studioの環境で利用でき、APIはフル利用、フルネイティブアプリ  2013年にMSとパートナーになり、16年には買収。無料カツOSS化した。  日本でも各種アプリがXamarinで製作されている事例がある。  Xamarin Nativie Xamarin Forms 2種類の開発手法がある。
  5. 5. XAMARIN関係の情報 @BUILD2018  19セッション  Adaptive Cardsが近日中にXamarinでも使えるようになる?(SDKまち)  ※ Cardは、SNSでよく見るやつを考えてくれればOK。  2018年のSpring UpdateよりHyper-V Androidエミュレーターがサポートされた  Google Playが使えるように・・・? ※ 現在この機能はプレビューである(Ver15.8 PV1よりサポート)  Xamarin FormsでCSSサポートがされることによる負担低減
  6. 6. XAMARIN.FORMS 3.0正式版リリース  FlexLayoutのサポート  ResourceDictionaryの改善  Right to Left Support  CSSサポート  Visual State Manager <重要> ビルド依存関係の更新があり、 Xamarin.Forms 3.0では.NET Standard 2.0を大幅に活用。 そのため、Xamarin Forms3.0を適用 して開発する前に.NET 4.7.1 をイン ストールされていないといけない。 でないと、404的なエラーが出てし まう。
  7. 7. FLEX LAYOUTとCSSのサポート  CSS に基づくもので、フレキシブル ボックス レイアウト モジュールと呼ばれる、いわゆるを子を整 列する多くの柔軟なオプションが含まれているレイアウト  FlexLayoutはLayout <View>から派生し、IList <View>型のChildrenプロパティを継承  CSSとの組み合わせでのデモもドキュメントにある。  https://docs.microsoft.com/ja-jp/xamarin/xamarin-forms/user-interface/layouts/flex-layout  カタログアイテム形式での表示も可能になるほか、上部のフォームで空いた空間を有効に活用すること が可能。
  8. 8. FLEXLAYOUTソース解読  まずはCSSでおさらい
  9. 9. FLEXLAYOUTソース解読 <FlexLayout Direction="Column" AlignItems="Center" JustifyContent="SpaceEvenly"> <Label Text="FlexLayout in Action" FontSize="Large" /> <Image Source="{local:ImageResource FlexLayoutDemos.Images.SeatedMonkey.jpg}" /> <Button Text="Do-Nothing Button" /> <Label Text="Another Label" /> </FlexLayout>
  10. 10. FLEXLAYOUTソース解読
  11. 11. CSSとの組み合わせは??  デモプログラム( https://docs.microsoft.com/ja-jp/xamarin/xamarin-forms/user- interface/layouts/flex-layout#css-styling-with-flexlayout ) では、Catalog Itemsページのレイアウ トを複製するのに、多くのCSSスタイルシートを使用。  CSSファイルのサポート方法は下記の通り  XAMLでファイルを定義し、CSSを呼び出す。  Label Text=“”でテキストを書き、 <Label StyleClass=“empty” />でCSSのクラスを呼び出す方法でサポート  Xamarin UNIVでこのコンテンツを学ぶことが可能 ( https://youtu.be/Ng3sel_5D_0 )
  12. 12. DO YOU KNOW 「XAMARIN WORKBOOKS」? Visual studio 2017でXamarin関係をインストールすると勝手に入ってきたやつで すねw 今回は、あまり目が当てられてないこのツールについて少し研究していければと 思います。
  13. 13. ABOUT XAMARIN WORKBOOKS  ドキュメント+LIVE コーディングの概念を載せたもの  開発者はこのアプリで利用できるファイルを読み進めて学習をすることができる  可変が可能  Android・iOs・Mac・WPFに対応し、ネイティブSDKでのサポート  名前空間の撤廃にはいつも通りUsingを使って定義  Nugetパッケージ追加はGUI、しかし書き方→#r "Microsoft.WindowsAzure.Mobile  めんどくさいことはしない。外部コードは#load “my-extra-code.csx”という風にする  モバイルアプリの動作には別途エミュレーター環境が必要  Workbooksのファイル=YAML ヘッダーをもつ Markdown ファイル https://msdn.microsoft.com/ja-jp/magazine/mt790187.aspx?f=255&MSPPError=-2147217396
  14. 14. 作業風景
  15. 15. せっかくなのでドキュメントを読む  チュートリアルで使い方がわかりやすくなっている。
  16. 16. XAMARIN 今後は・・・?  FORMSは6週ごとで何かしらの機能追加を行っている  次の機能追加は8月に
  17. 17. ドキュメンテーション統合化に向けて  既に一部の機能を移行しているが、今回本格的な移行となったのは下記の通り。  Xamarinドキュメント(docs.Microsoft.com/xamarin) →日本語化してあり、Formsに関してもすべて日本語化済み  サポートに関してもすでに移行されている。  ※今後フォーラム・ブログ・Xamarin UNIVが完全に移行される模様
  18. 18. WINDOWS 10のSDK対応させ続けるためにとった話  ついに全PCVS2017への移行となった・・・ (SDK入れるだけのUpdateには問題はないんだけど・・・)  つまずいたところはWindows 10のVersion1709から  VS15での対応はAniv Updateで止まってしまった・・・  SDK入れるということでも対応が可能だが、意外とめんどいのでVSごと入れ替えることに →XamarinはC#erということではなく、周りの情報も必要になってくる・・・
  19. 19. FLUTTERについて  Googleのオープンソースツールで、iOs・Androidのモバイルアプリが書ける  Dart言語を利用。  Flutter SDKのDL・Andrid Studioのインストールが必要  Android StudioとVS Codeどちらかのエディタで編集できる  まだまだツールとしてはベータ状態≠利用した人気アプリがある模様
  20. 20. まとめ  Xamarin.Forms 3.0での新サポート  Flex Layoutでレイアウトの可能性を広げる  CSSサポートでデザイナーにおけるCSSコーディングの幅が広がる  Xamarin Workbooksについて  紙の技術書を購入して、広げてやる→画面上でコード改変しながらプログラムの学習が可能  マークダウン+コードでライブコーディングを行うことが可能  その他  Xamarin.Formsの将来は2月ごとに変わっていく  FullerはDartで動かし、VSCodeでも編集が可能
  21. 21. 最後に~アプリ製作について  アプリ概要:BVE日本線 運転支援アプリ  Project Site:未公開(公開され次第お知らせいたします)  Github:https://github.com/TOBU66601/BVETimetableMobileapp  現在の進捗:列車情報の設営・ファイルシステムにおける外部ファイル作成  今後の展望:データベースとの接続・アプリ間連携・BtoC向けサイト構築
  22. 22. 参考URL  https://docs.microsoft.com/ja-jp/xamarin/android/get-started/installation/android- emulator/hardware-acceleration?tabs=vswin#hyper-v-overview  https://blog.xamarin.com/xamarin-forms-3-0-released/  https://docs.microsoft.com/ja-jp/xamarin/xamarin-forms/user-interface/layouts/flex-layout  https://docs.microsoft.com/ja-jp/xamarin/xamarin-forms/user-interface/styles/css/index  https://msdn.microsoft.com/ja-jp/magazine/mt790187.aspx?f=255&MSPPError=-2147217396  https://github.com/xamarin/Xamarin.Forms/wiki/Feature-Roadmap  https://jp.techcrunch.com/2018/02/28/2018-02-27-googles-flutter-ui-framework-is-now-in-beta/  https://github.com/flutter/flutter
  23. 23. ご清聴ありがとうございました。

×