NET MAUI for .NET 7 for iOS, Android app development
0 likes539 views
.NET MAUI for .NET 7 で iOS,Android アプリを開発してみよう https://dotnetlab.connpass.com/event/264192/
NET MAUI for .NET 7 for iOS, Android app development
- 1. .NET MAUI for .NET 7 で iOS/Android アプリを開発してみよう 鈴⽊ 章太郎 Elastic テクニカルプロダクトマーケティングマネージャー/エバンジェリスト デジタル庁 省庁業務サービスグループ ソリューションアーキテクト
- 2. Elastic Technical Product Marketing Manager/Evangelist デジタル庁 省庁業務サービスグループ ソリューションアーキテクト 元 Microsoft Technical Evangelist Twitter : @shosuz Shotaro Suzuki
- 3. Xamarin + Azure Mobile Services… https://www.slideshare.net/shosuz/microsoft-azure-mobile-services-xamarin# https://www.slideshare.net/shosuz/solution-semniar-vs2013multidevice1209new https://miso-soup3.hateblo.jp/entry/2016/04/27/011631
- 5. What's new in .NET MAUI
- 6. クライアント アプリの開発 が重要 Windows 10 & 11 devices worldwide iPhone & Android devices worldwide Sources: blog.google/products/android/android-12-beta/ ; www.imore.com/apple-earnings-call-transcripts-q1-2021 ;
- 7. あらゆる消費者向けデバイスで優れた パフォーマンスを発揮するネイティブアプリを、 単⼀のコードベースで開発する最も⽣産的 な⽅法 - 分離型ストレージ、センサー、ジオロケーション、カメラ等、 60以上のデバイスプラットフォーム機能にアクセスするため の API を C# から直接利⽤できる - 画像、アイコン、スプラッシュスクリーン等を含む、クロス プラットフォームリソースをサポート - すべてのデバイスターゲットに1つのプログラミング⾔語、 1つのコードベース、1つのプロジェクトシステムを使⽤ - .NET MAUI on Windows は WinUI をサポート、 Windows 10 および 11 のサポートされたバージョンで すべての最新のネイティブ機能を使⽤できる .NET マルチプラットフォームアプリ UI
- 8. .NET 7 における .NET MAUI Unified .NET モバイル、 デスクトップ、 ハイブリッド ⽣産性の⾼い 開発 1つの基底クラスライブラリ 型の統⼀ CLI サポート SDK スタイルプロジェクト モダンサポートライフサイクル Android iOS WinUI Mac Catalyst Blazor WebView 単⼀プロジェクト Microsoft.Extensions (マイクロソフト エクステンション) .NET ホットリロード XAML ホットリロード ビジュアル診断 .NET 7 .NET MAUI WinUI Mac Catalyst Android iOS macOS iOS
- 9. .NET の採⽤ Nov Dec Jan Feb Mar April May June バージョン別アクティブユーザー数 (リリースからの⽉数) .NET 5 .NET 6 1.7x 0 20 40 60 80 100 120 140 Feb-22 Mar-22 Apr-22 May-22 Jun-22 .NET MAUI 使⽤率 累積成⻑率 126% >5M total
- 10. .NET MAUI のパフォーマンス向上 44% 68% 0 100 200 300 400 500 600 700 800 900 Xamarin.Android .NET 6 Android Xamarin.Forms .NET 6 MAUI 起動時間(ミリ秒)
- 11. AndroidX AlohaKit CommunityToolkit.MVVM CommunityToolkit.Maui CommunityToolkit MauiCompat CommunityToolkit Markup.MauiCompat DevExpress Facebook FreshMvvm.Maui Google APIs for iOS Google Play Services Client Libraries GrialKit MauiAnimation Microsoft.Maui.Graphics MR.Gestures MSAL Prism.Maui Plugin.Fingerprint Plugin.InAppBilling Plugin.StoreReview Plugin.ValidationRules Progress Telerik UI for .NET MAUI ReactiveUI.Maui Realm by MongoDB Sentry Shiny SkiaSharp & Skottie Syncfusion .NET MAUI Controls TemplateUI User Dialogs コントロール、コンポーネント、プラグイン、ライブラリなど...
- 12. Productivity Visual Studio 2022 + .NET MAUI = アプリをより速く構築する
- 13. Visual Studio 2022の⽣産性 インテリジェントなコード編集 AI による開発⽀援 ライブシェアによる遠隔コラボレーション C#、XAML、Razor インテリセンス 迅速なイテレーション XAML、C#、Razor、CSS などのホットリロード デバッグ時のUIプレビューとインスペクション どこでもなんでも開発できる Android エミュレータ、デバイス、WSA の使⽤ Windows から直接 iOS を開発 Xcode 経由で iOS シミュレータを使⽤ Mac および Windows ⽤の Visual Studio
- 14. Visual Studio for Mac をインストールする https://learn.microsoft.com/ja- jp/visualstudio/mac/installation?view=vsm ac-2022
- 15. Visual Studio 2022 for Mac ⾼速かつスムーズな IDE 完全ネイティブな macOS UI Apple M1 のネイティブサポート .NET 7 で構築 モダン .NET 7 開発 iOS、macOS、Android のネイティブアプリ レスポンシブ Web UI Web、クラウド、コンテナ開発 統合されたツール XAML のホットリロードと UI のライブアップデート iOS シミュレータと Android エミュレータへの ⾼速デプロイメント 強⼒なデバッギング、リファクタリング、インテリセンス
- 16. .NET Multi-platform App UI documentation https://learn.microsoft.com/en-us/dotnet/maui/?view=net-maui-7.0
- 19. Native • android.widget • AndroidX libraries • Java/Kotlin APIs • UIKit • ARKit, AVKit, CarPlay, and dozens more • Obj-C/Swift APIs • Mac Catalyst • UIKit + AppKit • 数⼗種類のフレームワーク Obj-C/Swift APIs • Windows App SDK • WinUI 3 • C++ APIs
- 20. 特⻑、新機能、Xamarin からの変更点 特⻑ MVVM & XAML Android, iOS, macOS, Windows 7 Layouts 44 Views Maui.Essentials Maui.Graphics Xamarin.Forms Compat CommunityToolkit. Maui Maui.Markup Mvvm 新機能 BlazorWebView Border Shadows GraphicsView MenuBar Window/Multi-Window Default theme AppIcon SplashScreen Fonts Images Shell flyout templates Xamarin からの変更点 Color/Colors Zeroʼd defaults Namespace More XAMLC App Startup Lifecycle Events .NET workloads
- 23. マルチウインドウ
- 24. UI を越えて • API へのシンプルなアクセス • 各プラットフォームのサービスや 機能へのアクセス • App actions • Clipboard • Device sensors • File system • Network • Notifications • その他…
- 26. Blazor – .NETによるフルスタック Web アプリケーション
- 27. Blazor ハイブリッドアプリ .NET MAUI WinUI Mac Catalyst Android iOS macOS iOS Blazor • ネイティブと Web で UI コンポーネントを再利⽤ • ネイティブアプリコンテナと埋め込みコントロール • .NET 上に構築されたマルチプラットフォームアプリケーション UI Blazor WebView
- 28. スタックを選択する Reach Power Electron, CEF Native App with WebView Native App Hybrid Native BLAZOR + .NET MAUI .NET MAUI PWA Site Web BLAZOR C#, HTML, CSS C#, XAML
- 29. Demo .NET MAUI による Blazor ハイブリッド marinasundstrom/item-catalog https://github.com/marinasundstrom/item-catalog
- 33. .NET MAUI コミュニティ ツールキットの特徴 • Free + Open Source Library • Behaviors • Converters • Layouts • Views (例︓Popup、DrawingView) • .NET MAUI 開発者のために、.NET MAUI 開発者が作成 https://github.com/CommunityToolkit/Maui
- 34. C# UI 開発者向け .NET MAUI コミュニティ ツールキット • XAML が嫌いな⼈は、Maui.Markup Toolkit を使⽤すると、C# で UI コードを変更できる • 流暢な C# 拡張メソッドを提供して、読み取り、書き込み、および保守をより簡単にする https://github.com/CommunityToolkit/Maui.Markup
- 35. .NET MAUI コミュニティ ツールキットの新機能 • v1.4.0から紹介 https://github.com/CommunityToolkit/Maui/releases/tag/1.4.0
- 36. .NET MAUI コミュニティ ツールキット v1.4.0 で DockLayout を追加 • DockLayout を使⽤すると、任意のビューをページの上、下、左、右、および中央に簡単に固定できる • ドキュメント : https://learn.microsoft.com/dotnet/communitytoolkit/maui/layouts/docklayout • サンプルコード : https://github.com/CommunityToolkit/Maui/blob/1.4.0/samples/CommunityToolkit.Maui.Sample/Pages/Layouts/DockLa youtPage.xaml
- 37. .NET MAUI コミュニティ ツールキット v1.4.0 で DockLayout を追加 • DockLayout を使⽤すると、任意のビュー をページの上、下、左、右、および中央に 簡単に固定できる • ドキュメント https://learn.microsoft.com/dotn et/communitytoolkit/maui/layout s/docklayout • サンプルコード https://github.com/CommunityTo olkit/Maui/blob/1.4.0/samples/C ommunityToolkit.Maui.Sample/Pa ges/Layouts/DockLayoutPage.xa ml
- 38. .NET MAUI コミュニティ ツールキット v1.4.0 で DockLayout を追加 • DockLayout を使⽤すると、任意のビューをページの上、下、左、右、および中央に簡単に固定できる • ドキュメント https://learn.microsoft.com/dotnet/communitytoolkit/maui/layouts/docklayout • サンプルコード https://github.com/CommunityToolkit/Maui/blob/1.4.0/samples/CommunityToolkit.Maui.Sample/Pages/Layouts/DockLayoutPage.xaml
- 39. .NET MAUI コミュニティ ツールキット v1.4.0 で Expander を追加 • Expander を使⽤すると、ユーザーはビュー (Expander.Header) をタップして、より多くのコンテンツ (Expander.Content) を表⽰できます。 • ドキュメント https://learn.microsoft.com/dotnet/communityto olkit/maui/views/expander • サンプルコード https://github.com/CommunityToolkit/Maui/blob/ 1.4.0/samples/CommunityToolkit.Maui.Sample/Pa ges/Views/Expander/ExpanderPage.xaml
- 40. .NET MAUI コミュニティツールキット v1.4.0 StateContainer を追加 • ContentPage が “IsLoading”、“Completed”、“Failed” の場合のカスタム ルックを設定する • ドキュメント https://learn.microsoft.com/dotnet/communityto olkit/maui/layouts/statecontainer • サンプルコード https://github.com/CommunityToolkit/Maui/blob/ 1.4.0/samples/CommunityToolkit.Maui.Sample/Pa ges/Layouts/StateContainerPage.xaml UI をステート マシンに変えることができる
- 41. .NET MAUI コミュニティツールキット v2.0.0 で Tizen サポートを追加 .NET MAUI Community Toolkit を Samsung アプリで使⽤できる • ドキュメント https://learn.microsoft.com/dotnet/communitytoolkit/maui/#supported-versions • サンプルコード https://github.com/CommunityToolkit/Maui/blob/e80192b4384409b563d949d28c48d71e0c78d761/samples/CommunityToolkit.Maui.Sample /CommunityToolkit.Maui.Sample.csproj#L6
- 42. .NET MAUI コミュニティツールキット v3.0.0 は .NET 7.0 のサポートを追加 今後、新機能は .NET 7 のみをサポート https://github.com/CommunityToolkit/Maui/releases/tag/3.0.0
- 43. .NET MAUI Community Toolkit Maui.Markup Toolkit の新機能 最初に v1.2.0 について説明 https://github.com/CommunityToolkit/Maui.Markup/releases/tag/1.2.0
- 44. .NET MAUI コミュニティツールキット Maui.Markup v1.2.1 • カスタム コントロールを作成した場合でも、ソース ジェネレーターを使⽤して、すべての ITextAlignment コントロールの拡張メソッドを ⾃動⽣成 • ドキュメント https://learn.microsoft.com/dotnet/com munitytoolkit/maui/markup/extensions/ text-alignment-extensions • サンプルコード https://github.com/CommunityToolkit/ Maui.Markup/blob/main/samples/Com munityToolkit.Maui.Markup.Sample/Pag es/SettingsPage.cs ITextAlignment の C# 拡張メソッドを追加
- 45. .NET MAUI コミュニティツールキット Maui Markup v2.0.0 新機能は .NET 7 のみをサポート https://github.com/CommunityToolkit/Maui.Markup/releases/tag/2.0.0
- 46. Template Studio for .NET MAUI by Matt Lacey @mrlacey • 新しいアプリを作成時に、プロジェクト およびソリューションの名前と場所を 指定 • 必要なページや、機能を含められる 5 ステップのウィザード • 新しいアプリを作成するときの時間を ⼤幅に節約 • 役⽴つ構造をコードベースに提供す るのに役⽴つ • さまざまな機能、機能、およびコード の記述⽅法も確認できる • Docs https://github.com/mrlacey/ MauiAppAccelerator/issues https://marketplace.visualstudio.com/items?itemName=MattLaceyLtd.MauiAppAccelerator http://dlvr.it/SchDXl 新しい .NET MAUI アプリケーションの作成をより簡単かつ迅速に開始できるようにする Visual Studio 拡張機能
- 47. Template Studio for .NET MAUI by Matt Lacey @mrlacey - 1 新しい .NET MAUI アプリケーションの作成をより簡単かつ迅速に開始できるようにする Visual Studio 拡張機能 https://marketplace.visualstudio.com/items?itemName=MattLaceyLtd.MauiAppAccelerator
- 48. Template Studio for .NET MAUI by Matt Lacey @mrlacey - 2 新しい .NET MAUI アプリケーションの作成をより簡単かつ迅速に開始できるようにする Visual Studio 拡張機能 https://marketplace.visualstudio.com/items?itemName=MattLaceyLtd.MauiAppAccelerator
- 49. Template Studio for .NET MAUI by Matt Lacey @mrlacey - 3 新しい .NET MAUI アプリケーションの作成をより簡単かつ迅速に開始できるようにする Visual Studio 拡張機能 https://marketplace.visualstudio.com/items?itemName=MattLaceyLtd.MauiAppAccelerator
- 50. まとめ
- 52. .NET 7 ロードマップ .NET MAUIはデスクトップアプリケーションに最適 プラットフォームの相互運⽤性 チャンネル⼀覧 モバイル マップ …等々 コンテキストメニュー カーソル ホバージェスチャー 右クリックのジェスチャー タイトルバー ツールチップ
- 53. リリーススケジュール、サポート、パッチ • .NET MAUI のメジャーバージョンは、今後 .NET と共に出荷される予定です（.NET 7、.NET 8 など）。 • .NET MAUI は外部依存のあるオプションのワークロードです（Xcode と Android SDK ツールなど）。 • .NET MAUI のメジャーバージョンは、後継バージョン（メジャーバージョン）の出荷後6ヶ⽉間パッチを受け取ります。 • Xamarin SDK は、2024年5⽉までサポートを受けることができます。 .NET MAUI .NET 7 Nov 2022 18ヶ⽉間（.NET 8出荷後6ヶ⽉間）のパッチ提供 .NET 8 Nov 2023 .NET 9 Nov 2024 Xamarin EOS May 2024 Xcode 14 Android 32, 33
- 54. リソース（本⽂中以外） l Announcing .NET MAUI for .NET 7 General Availability https://devblogs.microsoft.com/dotnet/dotnet-maui-dotnet-7/ l .NET MAUI を使⽤してモバイルおよびデスクトップ アプリを構築する https://learn.microsoft.com/ja-jp/training/paths/build-apps-with-dotnet-maui/ l .NET MAUI for .NET 7 コードサンプル https://learn.microsoft.com/ja-jp/samples/browse/?expanded=dotnet&products=dotnet-maui l .NET Conf 2022 GitHub Repository l ".NET Conf: Focus on MAUI" Code & Slides https://github.com/dotnet-presentations/dotNETConf/tree/main/2022/FocusOnMAUI/Technical l dotnet-presentations/dotNETConf https://github.com/dotnet-presentations/dotNETConf/tree/main/2022 l PureWeen/dotnetConfDemo2022 (github.com) https://github.com/PureWeen/dotnetConfDemo2022
- 55. https://ela.st/icon-tokyo-2022 ElasticON Tokyo @ Westin Hotels & Resorts Tokyo (2022/11/30)
- 56. Thank you for your attention!
- 57. Demo .NET MAUI Deep Dive
- 59. .NET MAUI for .NET 7の⼀般提供開始について • Foldable (*. AndroidX.Window) • Window Positioning • Tool Tips • Context Menus • Accessibility Improvements • PointerGestureRecognizer • PointerOver VSM • TapGestureRecognizer improvements • Position Data • Secondary
- 60. • 1つの要素に取り付けられ、セカンダリ コマンドが表⽰ • セカンダリクリック（または指での⻑押し など、同等の操作）によって呼び出し • FlyoutBase.ContextFlyout プロパティによって要素に関連付け Context Menus
- 61. • 他のコントロールやオブジェクトに関する 追加情報を含むポップアップ • ユーザーが関連するコントロールにフォー カスを移すか、押し続けるか、ポインター を上に置くと、⾃動的に表⽰ • ユーザーが関連するコントロールから フォーカスを移す、押すのをやめる、また はポインターを置くのをやめると消える （ポインターがツールチップに向かって 移動している場合を除く） Tool Tips
- 62. • ポインタ⼊⼒ • ポインタ退出 • ポインタ移動 • ポインタ位置データ • ウィンドウの相対位置 • ビューの相対位置 Pointer Gesture Recognizer
- 64. タップジェスチャーの認識性能向上 • Buttons Mask • TappedEventArgs
- 67. Accessibility Updates • 前期に約35件のアクセシビリティに関するバグを解消。 • Windows デスクトップ体験に重点を置く • アクセシビリティ検証 “Calendar. 2 of 2 level 1. Selected.”
- 68. Honorable Desktop とマルチウインドウ機能 • MenuBar • MenuFlyoutSeparator (new) • Scoped Services
- 69. MenuBar
- 70. MS.EXT.DI によるスコープ付きサービス • AddSingleton • アプリレベルにスコープ • AddScoped • ウィンドウにスコープ • AddTransient • Single Use Types
- 71. Demo
- 72. Additional Notes • Visual Studio for Mac 17.4 が GA • 17.5 安定版を今すぐダウンロード • Announcing .NET MAUI for .NET 7 General Availability - .NET Blog (microsoft.com)