FormsͰ࢖͑ΔϥΠϒϥϦ΍ς ΫχοΫΛ͝঺հ ʙ೔ຊञΞϓϦSakenomy͸ɺForms੡Ͱ͢ʙ 

ࣗݾ঺հ Sakenomyͬͯ ςΫχοΫ ListView + Cell Custom Url Scheme ϥΠϒϥϦ FFImageLoading ACR UserDialogs 

XamarinແྉԽʂ ΦʔϓϯιʔεԽʂ 

ࣗݾ঺հ ଠా઒ɹ༸ʢ͓͓͕ͨΘɹΑ͏ʣ • 2013೥4݄ גࣜձࣾΤϜςΟʔΞΠʹ৽ଔೖࣾ • ϞόΠϧΞϓϦέʔγϣϯΤϯδχΞ • ۀ຿ͰObjective-C & javaΛɺڵຯͰswift & kotlin • ̎೥લ͔Β Xamarin (iOS → Forms) • ઈࢍ TypeScript ͰͷϑϩϯτΤϯδχΞษڧத • twitter.com/AyaseSH • www.facebook.com/you.ootagawa 

Sakenomyͱ͸ 

No content

ʮ೔ຊञΛֶͿʯ ʮ೔ຊञΛ୳͢ʯ ʮ೔ຊञΛه࿥͢Δʯ ʮ৽ͨͳ೔ຊञͱग़ձ͏ʯ Sakenomy 

ListView + ViewCell 

Button inside Cell • એݴ࣌ʹॻ͖׵͑ΔͱViewCellʹҾ਺͕Θͨͤ·͢ɻ • CellͷதʹButtonͷ࣮૷͍ͨ࣌͠ɺActionΛ౉͢͜ͱͰ ListView͔ΒΠϕϯτͷίϯτϩʔϧ͕ग़དྷ·͢ɻ WBS
MJTU7JFX

OFX
-JTU7JFX
\
*UFN5FNQMBUF

OFX
%BUB5FNQMBUF UZQFPG 4BNQMF-JTU7JFX$FMM
*UFNT4PVSDF

MJTU4PVSDF
^ WBS
MJTU7JFX

OFX
-JTU7JFX
\
*UFN5FNQMBUF

OFX
%BUB5FNQMBUF

OFX
4BNQMF-JTU7JFX$FMM
*UFNT4PVSDF

MJTU4PVSDF
^ 

Button inside Cell ※΍Γํ࣍ୈͰ͸ViewΛ౉͠ޙ෇΋Ͱ͖·͕͢ɺ X.Forms v2.1͔ΒTemplateΛෳ਺࣋ͯͨΓ͢ΔͷͰࠓ͸ඞཁͳ͍͔ͱࢥ͍·͢ "DUJPO
UBQ



4ZTUFN%JBHOPTUJDT%FCVH8SJUF-JOF $BMMFE
.FUIPE
"DUJPO5BQ 
WBS
MJTU7JFX

OFX
-JTU7JFX
\




*UFN5FNQMBUF

OFX
%BUB5FNQMBUF

OFX
4BNQMF-JTU7JFX$FMM UBQ




*UFNT4PVSDF

MJTU4PVSDF
^ QVCMJD
DMBTT
4BNQMF-JTU7JFX$FMM

7JFX$FMM
\




4UBDL-BZPVU
@TUBDL-BZPVU




QVCMJD
4BNQMF-JTU7JFX$FMM "DUJPO
UBQ

UIJT




\








WBS
CVUUPO

OFX
#VUUPO \
5FYU

"EE#VUUPO
5FYU$PMPS

$PMPS/BWZ
^








CVUUPO$MJDLFE

TFOEFS
F

UBQ 








@TUBDL-BZPVU$IJMESFO"EE OFX
$POUFOU7JFX
\
$POUFOU

CVUUPO
7FSUJDBM0QUJPOT

-BZPVU0QUJPOT$FOUFS
^ 




^
ddd 

Button inside Cell CellΛCellࣗ਎Ͱม͑ͯ͠·͑ • ListView͔Βมߋ͢Δͱ DataTemplateͷ࠶౓ॳظԽ΍ ListͰ͸ͳ͘ ObservableCollectionΛ࢖ ͏ඞཁ͕͋Δ 

Button inside Cell • CellͷBindingContextʹදࣔͷσʔλ͕͋Δ • CellͰ্ॻ͖͢Ε͹σʔλ΋มΘΔ nextButton.Clicked += (sender, e) =>
 {
 var property = BindingContext as Property;
 BindingContext = new Helper().NextColor(property);
 };
 
 var beforeButton = new Button {
 Text = "Before",
 WidthRequest = 100,
 VerticalOptions = LayoutOptions.FillAndExpand
 };
 beforeButton.Clicked += (sender, e) =>
 {
 var property = BindingContext as Property;
 BindingContext = new Helper().BeforeColor(property);
 }; var listView = new ListView
 {
 ItemTemplate = new DataTemplate(() => new SampleListViewCell()),
 ItemsSource = new List(),
 HasUnevenRows = true,
 }; 

Sample.iOS 

Custom Url Scheme 

Custom Url Scheme • Url Scheme ͱ͸ɺޚଘ஌ͷ௨Γ”http”ͷ͜ͱ • ϞόΠϧΞϓϦͰ͸
 SchemeΛมߋͨ͠ϦϯΫΛ౿·ͤΔͱରԠͨ͠ΞϓϦ ʹભҠͤ͞Δ͜ͱ͕Ͱ͖Δ࢓૊Έ • LINEͩͬͨΒ line:// ͳͲɹTwitterͰ͸ twitter:// ͳͲ • iOSͷUniversal Links͸৮Ε·ͤΜʢWebଆͷ࢓૊Έ͕ Α͘Θ͔ͬͯͳ͍…ʣ 

Πϝʔδ • X.Formsͷόʔδϣϯ͋͛ ͨΒAndroidͷγϛϡ Ϩʔλʔ͕ಈ͔ͳ͘ͳͬ ͨʗ(^o^)ʘ 

Android • MainActivity ʹ Attribute ௥Ճ // sakenomy-schemes://ayase.com/Sheeeeeeeep?id=1 [IntentFilter( new[]{ Intent.ActionView }, 
 Categories = new[]{ Intent.CategoryDefault, Intent.CategoryBrowsable },
 DataScheme = "sakenomy-schemes",
 DataHost = "ayase.com",
 DataPathPrefix = “/Sheeeeeeeep", 
 DataPathPattern = “*")] public class MainActivity : FormsApplicationActivity {
 protected override void OnCreate(Android.OS.Bundle savedInstanceState) {
 ~~~ ~~~
 if (Intent.Data != null && !string.IsNullOrEmpty(Intent.Data.EncodedPath) && !string.IsNullOrEmpty(Intent.Data.EncodedQuery)) {
 var prefix = Intent.Data.EncodedPath;
 var id = Intent.Data.GetQueryParameter("id");
 
 if (Intent.Data.EncodedPath.Equals(“/Sheeeeeeeep”) {
 MessagingCenter.Send (Xamarin.Forms.Application.Current as NSake.Core.App, "Ayase", id);
 } } } 

iOS 1. Info.plist > Advanced > URL Types > Add URL Type 2. AppDelegate.cs > OpenUrl Λ override // sakenomy-schemes://ayase.com/Sheeeeeeeep?id=1 public override bool OpenUrl (UIApplication application, NSUrl url, string sourceApplication, NSObject annotation) { if (url.LastPathComponent.Equals(“Sheeeeeeeep”) && url.Query.Contains(“id=")) { MessagingCenter.Send(Xamarin.Forms.Application.Current as App, "Ayase", url.Query.Split(‘=')[1]); return true; } return false; } 

Xamarin.Forms • id͸AppͷҾ਺Ͱ౉͢͜ͱ΋Ͱ͖Δ͔ͳʁ • MessagingCenterΛ࢖༻ͨ͠ཧ༝͸ɺ
 ෳ਺ͷ࣮૷Λͨ࣌͠ʹɺCoreଆͷ࣮૷͕͖ͬ͢Γ • ͔͠͠ ֤ϓϥοτϑΥʔϜͰͷ࣮૷͸ ifจ ͷཛྷ… public App() { ~~~ ~~~ MessagingCenter.Subscribe (this, "ShowTasted", (sender, arg) => naviPage.PushAsync(new AyasePage(arg))); // arg == id ~~~ ~~~
 } 

FFImageLoading 

FFImageLoading https://www.nuget.org/packages/Xamarin.FFImageLoading.Forms 

FFImageLoading ػೳҰཡ • ϝϞϦΩϟογϡͱͦͷσΟεΫ༰ྔͷઃఆ • ॏෳͨ͠ϩʔυཁٻͷ৔߹ɺআ֎͢Δ • Τϥʔɺϩʔυ࣌ʹϓϨεϗϧμʔͱͯ͠ը૾Λઃఆ Մೳ • ը૾ͷϩʔυࣦഊ࣌ɺࣗಈϦτϥΠʢϦτϥΠ਺΍ ϦτϥΠִؒͷઃఆՄೳʣ • ৭ʑը૾Λม׵ͯ͘͠ΕΔɻؙͨ͘͠Γɺനࠇͨ͠Γ • ϩʔυͨ͠ը૾͔ΒByte[]͕औΕΔ 

FFImageLoading + ReactiveProperty WBS
MBCFM

OFX
$BDIFE*NBHF








\

















"TQFDU

"TQFDU"TQFDU'JU
















8JEUI3FRVFTU


















)FJHIU3FRVFTU


















$BDIF%VSBUJPO

5JNF4QBO'SPN%BZT 


Ωϟογϡظؒ
















'BEF"OJNBUJPO&OBCMFE

GBMTF
















-PBEJOH1MBDFIPMEFS

MPBEJOH*NBHFQOH
















)PSJ[POUBM0QUJPOT

-BZPVU0QUJPOT$FOUFS
















7FSUJDBM0QUJPOT

-BZPVU0QUJPOT$FOUFS
















5SBOTGPSNBUJPOT

OFX
-JTU''*NBHF-PBEJOH8PSL*5SBOTGPSNBUJPO
\


ม׵




















OFX
''*NBHF-PBEJOH5SBOTGPSNBUJPOT$JSDMF5SBOTGPSNBUJPO


ؙ͘͢Δ
















^








^
MBCFM4FU#JOEJOH7JFX.PEFM $BDIFE*NBHF4PVSDF1SPQFSUZ
WN

WN*NBHF1SPQFSUZ7BMVF 
WBS
UBQ-BCFM

OFX
5BQ(FTUVSF3FDPHOJ[FS 
UBQ-BCFM5BQQFE

BTZOD
TFOEFS
F

\
















WBS
JNBHFT

BXBJU
MBCFM(FU*NBHF"T+QH"TZOD 
















WBS
DPNNBOE

#JOEJOH$POUFYU
BT
7JFX.PEFM 5BQQFE$PNNBOE&YDVUF JNBHFT 








^
MBCFM(FTUVSF3FDPHOJ[FST"EE UBQ-BCFM 


ACR UserDialogs 

ACR UserDialogs • MVVMͰͷ՝୊ͷҰͭ ϙοϓΞοϓ • ≒ MvvmCrossͷDialogService https://www.nuget.org/packages/Acr.UserDialogs/ 

࣮૷ WBS
DPOpH

OFX
"MFSU$POpH
\




5JUMF

3FTPVSDFT&SSPS@4FMFDU@5JUMF




.FTTBHF

3FTPVSDFT&SSPS@[email protected]




0O0L



\

ॲཧ

^
^
BXBJU
6TFS%JBMPHT*OTUBODF"MFSU"TZOD DPOpH 
6TFS%JBMPHT*OTUBODF"MFSU DPOpH  VTJOH
WBS
MPBEJOH%JBMPH

6TFS%JBMPHT*OTUBODF-PBEJOH lϩʔσΟϯάz
\

ॏ͍ͨॲཧ΍αʔόʔͱͷ௨৴ॲཧΛॻ͍ͨΓ
^ 

ࠔͬͨͱ͖ ٸʹಈ͔ͳ͘ͳͬͨ࣌ • ͱ͋ΔOSͷͱ͋Δ୺຤ͷΈόά͕ى͖ͨ • UIAlertController͕དྷͨ ͦͷ࣌ʹ͸ࣗ෼Ͱ࣮૷Λ্ॻ͖Ͱ͖Δͷ΋޷ධՁ
OBNFTQBDF
.Z"QQ1PQVQ7JFX
\




QVCMJD
DMBTT
.Z$VTUPN6TFS%JBMPHT

"DS6TFS%JBMPHT6TFS%JBMPHT*NQM
\








QVCMJD
PWFSSJEF
WPJE
"MFSU "DS6TFS%JBMPHT"MFSU$POpH
DPOpH
\












WBS
EMH

OFX
6*"MFSU7JFX DPOpH5JUMF

4USJOH&NQUZ
DPOpH.FTTBHF
OVMM
OVMM
DPOpH0L5FYU 












JG
DPOpH0O0L

OVMM
EMH$MJDLFE

T
F

DPOpH0O0L 












EMH4IPX 








^




^
^ QVCMJD
QBSUJBM
DMBTT
"QQ%FMFHBUF
HMPCBM9BNBSJO'PSNT1MBUGPSNJ04'PSNT"QQMJDBUJPO%FMFHBUF
\
QVCMJD
PWFSSJEF
CPPM
'JOJTIFE-BVODIJOH 6*"QQMJDBUJPO
VJ"QQMJDBUJPO
/4%JDUJPOBSZ
MBVODI0QUJPOT
\
6TFS%JBMPHT*OTUBODF

OFX
.Z"QQ1PQVQ7JFX.Z$VTUPN6TFS%JBMPHT 
^
^ 

·ͱΊ SakenomyΑΖ͓͘͠ئ͍͠·͢ʂ 

͓͠·͍ ͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠