Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Xamarinで割り勘アプリを作る
Search
Ryosuke Uchiyama
January 31, 2020
Programming
140
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Xamarinで割り勘アプリを作る
Ryosuke Uchiyama
January 31, 2020
More Decks by Ryosuke Uchiyama
See All by Ryosuke Uchiyama
AWSでサーバレスな書籍管理アプリを作る
step63r
0
58
PythonでSlack通知botを作る
step63r
0
22
ChatGPT実践
step63r
1
390
IoT実践! 行先予定表を電子ペーパーで作る
step63r
0
35
React x Socket.ioで人狼サーバを作る 第一章 フロントエンド実装
step63r
0
25
深層強化学習で東方AI 第一章 DQNの基本
step63r
0
310
Build 2021 プレイバック
step63r
0
38
WPFで実践アプリ開発! 第四章 機能の実装 Part 2
step63r
0
54
WPFで実践アプリ開発! 第三章 機能の実装 Part 1
step63r
0
130
Other Decks in Programming
See All in Programming
これって Effect でできたのでは? / TSKaigi Mashup Kansai #2
susisu
0
240
仕様書を書く前にハーネスを作る - Agent Native開発は「探索を速く、判定を固く」
gotalab555
4
1.7k
仕様駆動開発の消費期限
watany
20
8.4k
変わらないものが、変わるものを決める — 意図駆動開発 × イベントソーシング × イミュータブル | What Doesn't Change Decides What Can — IDD × Event Sourcing × Immutability
tomohisa
0
1.7k
言葉の格闘技のススメ~紙とペンと言葉から始める、キャリアの描き方~
progresscicada
2
150
Go 1.27 における memory allocation の高速化
andpad
0
190
運用ダッシュボードの設計を誰も教えてくれないのだけどみなさんどうしてるんですか? - チームに監視するという文化を根付かせるための第一歩を踏みたい -
satoshi256kbyte
1
120
jsmini JavaScript Engine を作ってみた話
yosuke_furukawa
PRO
0
320
属人化した知識を、 AIが辿れる地図にする
pkshadeck
PRO
1
180
わからない話を追いかけたら、プログラミング言語を作る側にいた
ydah
3
510
Claude Code全社展開のためにやったことn選~プラグイン302個・コミッター271人を支えるために~
kenchan
5
1.5k
the container ship “Apple Silicon”@WWDC26 Recap -Japan-\(region).swift
shingangan
0
130
Featured
See All Featured
Organizational Design Perspectives: An Ontology of Organizational Design Elements
kimpetersen
PRO
1
790
State of Search Keynote: SEO is Dead Long Live SEO
ryanjones
0
240
brightonSEO & MeasureFest 2025 - Christian Goodrich - Winning strategies for Black Friday CRO & PPC
cargoodrich
3
770
The Language of Interfaces
destraynor
162
27k
Pawsitive SEO: Lessons from My Dog (and Many Mistakes) on Thriving as a Consultant in the Age of AI
davidcarrasco
0
210
Paper Plane
katiecoart
PRO
2
53k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
960
Making the Leap to Tech Lead
cromwellryan
135
10k
Game over? The fight for quality and originality in the time of robots
wayneb77
1
240
Claude Code どこまでも/ Claude Code Everywhere
nwiizo
66
57k
Large-scale JavaScript Application Architecture
addyosmani
515
110k
Test your architecture with Archunit
thirion
1
2.3k
Transcript
Xamarinで割り勘アプリを作る Ryosuke Uchiyama
ソースコード step63r/DrinkPartyBillSplit https://github.com/step63r/DrinkPartyBillSplit
10分で分かった気になるXamarin
今までのアプリ開発 iOS App Android App Windows App Objective-C Xcode Java
Eclipse C# Visual Studio
モバイル向けクロスプラットフォーム開発環境? No Silver Bullet 銀の弾丸などない
Xamarin • ネイティブAPIを100%移植 • ネイティブアプリを作成できる • C# / .NET /
Visual Studioで開発できる • コードを共通化できる • 画面も共通化できる
Xamarinネイティブ iOS C# UI Android C# UI Windows C# UI
Shared C# Backend
Xamarin.Forms Shared C# Backend Shared UI Code iOS Android Windows
もっと詳しく
Page群
Layout群
Control群 ActivityIndicat or BoxView Button DatePicker Editor Entry Image Label
ListView Map OpenGLView Picker ProgressBar SearchBar Slider Stepper TableView TimePicker WebView EntryCell ImageCell SwitchCell TextCell ViewCell
.NET StandardによるBCLの一元化
.NET StandardによるBCLの一元化
Portable Class Library (PCL)
MVVMパターン
WPFにおける見た目 <> C# XAML (MainWindow.xaml) コードビハインド (MainWindow.xaml.cs)
素直に分離 <> XAML (MainWindow.xaml) C# コードビハインド (MainWindow.xaml.cs) C# その他クラス 見た目
ロジック
データバインディングに最適化 <> XAML + コードビハインド C# C# その他クラス C# 見た目
ロジック データバインドの ソース
MVVMパターン View ViewModel Model データ バインディング コマンド メソッド呼出し プロパティ設定 変更通知
変更通知
なぜMVVMなのか • 見た目とロジックを分離できる • 分離できるのでテストコードが書きやすくなる • コードビハインドの記述が減る(複雑な描画処理の場合は必要) • UIスレッド外からの変更通知が容易に受け取れる •
Viewがインスタンスを持たなくてもオブジェクトの操作が可能になる
割り勘アプリ
開発環境 • Windows 10 Pro (64-bit) • SO-01H / Android
7.0 (Nugat) • Visual Studio Professional 2019 • .NET Standard 2.0 ※iOS版はビルド環境なしのため対象外
機能概要 • 飲み会の割り勘金額を計算する • 役職ごとに参加人数とうち主賓人数を入力し、精算額を按分する • 主賓の負担金額は0円とする • 役職は職位と名前で任意に設定できる •
割り勘金額計算ルールはなるべく柔軟に決められるようにする • 役職設定と飲み会データはXML形式で保存する
画面遷移 宴会一覧・追加 宴会詳細 メニュー 役職一覧・追加・削除
データモデル 飲み会クラス • 飲み会ID • 開催日付 • 飲み会名 • 参加者リスト
• 合計金額 役職クラス • 役職ID • 役職名 参加者クラス • 役職ID • 参加人数 • 主賓人数 割り勘後支払額クラス • 役職 • 支払人数 • 一人あたり金額 標準割り勘ルール • 割り勘金額を計算する 割り勘ルールインタフェース 計算
Data Models Party string ID DateTime Date string Name List<Attendee>
Attendees int TotalFee Grade int Id string Name Attendee Grade Grade int TotalCount int GuestCount SplitBill Grade Grade int Payer int Amount DefaultSplitRule CalculateAmountAsync() ISplitRule 計算
ファイルの保存先について • XamarinのファイルIOはプラットフォームにより異なる • なのでファイル作成や保存ロジックも本来ならばOS個別に書く必要がある • が、それはとてもめんどくさい(低レイヤはあまり深く考えたくない!) • そこで、PCL Storageというライブラリを使う
• これでXamarin.FormsのIOロジックを共通に呼び出せるようになる • ただし.NET Standardプロジェクトの場合、本当はNetStandard Storageを使 う必要があるが、Warningでビルドは通るのでひとまず無視する
Visual Studio 2019でXamarin Androidエミュレータ設定まで
インストール
Hyper-V /Windows Hypervisor Platform
Android SDK Manager
Android Device Manager
プロジェクトの作成
Demo
Appendix
参考文献 • 10分間で分かった気になれるXamarin概要 - Build Insider • 第1回:Xamarinでアプリを作ろう (1/5):特集:Visual StudioとXamarinで始めるiOS/Android/UWPアプリ開発
- @IT • Introducing .NET Standard – .NET Blog • プログラミングな日々: MVVMとは何か • Xamarin で ItemsControl っぽいコントロールを作りたい(1) - しっぽを追いかけて • GitHub - dsplaisted/PCLStorage: PCL Storage - Portable Storage APIs • Hyper-VでサクサクAndroidエミュレータを使おうと思ったらハマったはなし – Qiita