Tworzenie cross-platformowych aplikacji w Xamarin.Forms

Transkrypt

1 Tworzenie cross-platformowych aplikacji w Xamarin.Forms Wprowadzenie Tomasz Gibulski Microsoft Certified Professional (MCP) Microsoft Certified Technology Specialist (MCTS) tomasz@gibulski.com

2 Agenda Xamarin.Forms z czym to się je? Przygotowanie środowiska programistycznego Pierwsza aplikacja w Xamarin.Forms Architektura projektu Tworzenie interfejsu użytkownika UI Debugowanie i uruchamianie aplikacji (emulator, symulator, urządzenia fizyczne) Przykładowa aplikacja mobilna stworzona w Xamarin.Forms

3 początki urządzeń mobilnych Palmtopy

4 Cel: Jeden kod wszystkie platformy

5 Dlaczego Xamarin? Piszesz jeden kod na wszystkie platformy (ios, Android, UWP) Piszesz kod w przyjaznym języku C# Tworzysz natywne aplikacje ios i Android Tworzysz aplikacje bezkosztowo - Xamarin jest darmowy Testujesz swoje aplikacje w emulatorach, symulatorach lub urządzeniach fizycznych Możesz testować swoje aplikacje na tysiącach urządzeń w chmurze

6 Xamarin Współdzielenie kodu C# 100% dostęp do natywnego API Wysoka wydajność

7 Xamarin Interfejs użytkownika tworzony na każdą platformę indywidualnie Współdzielenie logiki aplikacji Około 60% kodu może być współdzielonego

8 Xamarin.Forms Tworzysz natywny interfejs użytkownika UI dla Android, ios i Windows z jednego współdzielonego kodu.

9 Xamarin + Xamarin.Forms Xamarin Native (Xamarin.IOS, Xamarin.Android, Xamarin.UWP) Xamarin.Forms Logika biznesowa + Interfejs użytkownika

10 Xamarin.Forms Nawet 95% wspólnego kodu

11 Xamarin.Forms vs Xamarin.Native Xamarin.Forms: Aplikacja ma być stworzona szybko Zespół programistów bardziej doświadczony w.net niż Android i ios Nieduży budżet Łatwiejsze aktualizowanie aplikacji Wysoka wydajność Xamarin.Native: Aplikacja ma mieć dużo animacji i rozbudowany interfejs użytkownika Niewielki rozmiar aplikacji Aplikacja ma korzystać z natywnych funkcji nie dostępnych na obu platformach Bardzo wysoka wydajność

12 Co zawiera Xamarin.Forms Ponad 40 typów: stron, układów i kontrolek tworzonych w XAML lub w kodzie. Nawigacja pomiędzy stronami Dwu kierunkowe wiązanie danych API do tworzenia animacji Łatwy do zastosowania wzorzec MVVM Messaging Center Dependency Service

13 Pages (strony) i Layouts (układy) Pages Layouts

14 Views (kontrolki)

15 StackLayout

16 Grid

17 ScrollView

18 Frame

19 Definiowanie interfejsu użytkownika XAML <StackLayout Spacing="10"> <Label HeightRequest="110" HorizontalOptions="FillAndExpand" Text="LoginPage" TextColor="Blue" FontSize="30" HorizontalTextAlignment="Center" VerticalTextAlignment="Center"/> <Entry Margin="20,40,20,0" HeightRequest="50" Placeholder=" " BackgroundColor="LightBlue"> </Entry> <Entry Margin="20,0,20,0" HeightRequest="50" IsPassword="true" Placeholder="Password" BackgroundColor="LightBlue"> </Entry> <Button x:name="loginbutton" Margin="20,0,20,0" HeightRequest="50" TextColor="White" Text="Login" HorizontalOptions="FillAndExpand" BackgroundColor="Blue"/> </StackLayout>

20 Renderers in Xamarin.Forms

21 Uruchamianie i testowanie aplikacji Urządzenia fizyczne z Android i ios Symulator ios Emulator Android Emulatory i urządzenia dostępne w chmurze

22 Włączanie opcji developera w Android Należy dotknąć 7 razy etykietę z numerem kompilacji (Build numer): Samsung Galaxy S7 and later: Settings > About phone > Software information > Build number Google Pixel: Settings > System > About phone > Build number LG G6 and later: Settings > About phone > Software info > Build number HTC U11 and later: Settings > About > Software information > More > Build number OnePlus 5T and later: Settings > About phone > Build number

23 Włączanie opcji developera w Android

24 Włączanie trybu debugowania

25 Przygotowanie środowiska programistycznego 1. Upewnij się, czy Twój komputer jest gotowy na Visual Studio 2. Pobierz Visual Studio 3. Uruchom Visual Installer 4. Wybierz pakiety na zakładce Workloads do zainstalowania 5. Wybierz indywidualnie komponenty (opcjonalnie) 6. Wybierz pakiety językowe (opcjonalnie) 7. Uruchom Visual Studio i stwórz swoją pierwszą aplikację!

26 1. Sprawdź wymagania Visual Studio i parametry Twojego komputera

27 2. Pobierz Visual Studio

28 3.a. Uruchom Visual Installer

29 3.b. Uruchom Visual Installer

30 4. Wybierz pakiet Mobile na zakładce Workloads

31 5. Wybierz indywidualnie komponenty (opcjonalnie)

32 6. Wybierz pakiet językowy

33 7. Uruchom Visual Studio i stwórz swoją pierwszą aplikację!

34 Tworzymy nowy projekt

35 Wybieramy typ projektu

36 Wybieramy szablon

37 Struktura projektu

38 File -> New -> Project Demo

39 Obiecująca, intensywnie rozwijana technologia. Podsumowanie Xamarin.Forms Nie dla każdego typu aplikacji. Około 90% wspólnego kodu.

40 Tworzenie cross-platformowych aplikacji w Xamarin.Forms Wprowadzenie Tomasz Gibulski tomasz@gibulski.com