Cześć,
Zgodnie z obietnicą w poprzednim poście, dziś chciałbym się z Wami podzielić kolejną ciekawą funkcjonalnością, którą jakiś czas temu udało mi się wdrożyć. Dotyczy ona wykorzystania kontrolki SearchBar w Toolbarze.
Niestety, wymaga to nieco większej roboty, ponieważ sam framework Xamarin.Forms nie dysponuje takim zasobem.
Na szczęście twórcy frameworka zadbali o to i dali możliwość tworzenia własnych kontrolek, dzięki mechanizmowi Custom Renderers.
Dziś stworzymy sami pod podstaw nową stronę (analogiczną do ContentPage, NavigationPage, itp.) z wbudowaną kontrolką SearchBar w Toolbarze.
Do dzieła!!!
Najpierw zajmiemy się platformą Android.
- W folderze layout tworzymy plik z rozszerzeniem axml.
2. Następnie tworzymy analogicznie plik w folderze menu.
Dzięki temu w toolbarze pojawi się ikonka „lupy”, za pomocą której ukaże się EditText umożliwiający wyszukiwanie elementu.
3. Tworzymy folder Renderers, a w nim klasę dziedziczącą po PageRenderer. Następnie implementujemy funkcjonalność kontrolki.
4. W klasie MainActivity tworzymy statyczny obiekt klasy Toolbar, a następnie przesłaniamy metodę OnCreateOptionsMenu(IMenu menu).
5. Wracamy do projektu części wspólnej i tu implementujemy właściwości kontrolki, z jakich chcemy korzystać, np. Text czy też Command. Co ciekawe nazwy właściwości mogą być dowolne. Ja zastosowałem takie jak poniżej.
I to wszystko. Teraz możemy korzystać z kontrolki w code behind lub pliku XAML (co ja przeważnie stosuję).
Ja zaimplementowałem stronę wyświetlającą zwykły tekst.
Ostateczny efekt wygląda tak:
Skoro mamy już możliwość tworzenia strony „SearchPage” na platformę Android wypadałoby dać ten sam efekt dla iOS.
Co należy zrobić?
Wystarczy analogicznie zastosować punkt 3, z tym że robimy to po części projektu iOS. Ponieważ na platformie iOS nie możemy implementować widoków w pliku XML, w związku z tym robimy to w klasie SearchPageRenderer.
Teraz możemy zobaczyć jak wygląda to na systemie iOS.
Mam ogromną nadzieję, że dzisiejszy wpis bardzo się wszystkim spodoba, a zwłaszcza tym którzy chcieli wykorzystać takie rozwiązanie w swoich projektach mobilnych 😉
Ja tymczasem kończę i zapraszam za tydzień na kolejny post 😉
Trzymajcie się! 🙂
Cześć 🙂
GitHub Code?
PolubieniePolubienie
Unfortunaly, I don’t have source code for this solution, but really you can use it 😉 That’s really enough.
If you want, you can see for Xamarin.EntryAutoComplete in my Github. It’s very similar solution.
PolubieniePolubienie