Tworzenie cross-platformowych aplikacji w Xamarin.Forms Wprowadzenie Tomasz Gibulski Microsoft Certified Professional (MCP) Microsoft Certified Technology Specialist (MCTS) tomasz@gibulski.com www.gibulski.com
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
początki urządzeń mobilnych Palmtopy
Cel: Jeden kod wszystkie platformy
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
Xamarin Współdzielenie kodu C# 100% dostęp do natywnego API Wysoka wydajność
Xamarin Interfejs użytkownika tworzony na każdą platformę indywidualnie Współdzielenie logiki aplikacji Około 60% kodu może być współdzielonego
Xamarin.Forms Tworzysz natywny interfejs użytkownika UI dla Android, ios i Windows z jednego współdzielonego kodu.
Xamarin + Xamarin.Forms Xamarin Native (Xamarin.IOS, Xamarin.Android, Xamarin.UWP) Xamarin.Forms Logika biznesowa + Interfejs użytkownika
Xamarin.Forms Nawet 95% wspólnego kodu
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ść
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
Pages (strony) i Layouts (układy) Pages Layouts
Views (kontrolki)
StackLayout
Grid
ScrollView
Frame
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="Email" 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>
Renderers in Xamarin.Forms
Uruchamianie i testowanie aplikacji Urządzenia fizyczne z Android i ios Symulator ios Emulator Android Emulatory i urządzenia dostępne w chmurze
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
Włączanie opcji developera w Android
Włączanie trybu debugowania
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ę!
1. Sprawdź wymagania Visual Studio i parametry Twojego komputera
2. Pobierz Visual Studio
3.a. Uruchom Visual Installer
3.b. Uruchom Visual Installer
4. Wybierz pakiet Mobile na zakładce Workloads
5. Wybierz indywidualnie komponenty (opcjonalnie)
6. Wybierz pakiet językowy
7. Uruchom Visual Studio i stwórz swoją pierwszą aplikację!
Tworzymy nowy projekt
Wybieramy typ projektu
Wybieramy szablon
Struktura projektu
File -> New -> Project Demo
Obiecująca, intensywnie rozwijana technologia. Podsumowanie Xamarin.Forms Nie dla każdego typu aplikacji. Około 90% wspólnego kodu.
Tworzenie cross-platformowych aplikacji w Xamarin.Forms Wprowadzenie Tomasz Gibulski tomasz@gibulski.com www.gibulski.com