MDC-102: Maddi quruluş və layout

Material dizaynı, istifadənin asan rahatlığını təmin edən naviqasiya formatlarını təklif edir. Ən görünən komponentlərdən biri yuxarı tətbiqetmə çubuğudur.

Google Play Developer hesabı yaradın

Şəxsi məlumatlarınızı, seçdiyiniz ünvanı və şifrənizi məlumatlandırın.

Ümumi satış şərtlərini qəbul edin (GTC).

Özünüzə gözəl bir şəkil əlavə edin.

Google Play Developer hesabı yaradın

Google Play Developer hesabı yaratmaq proseduru Apple-də daha sadədir.

Gmail ünvanınızla əlaqə qurun.

GTC qəbul edin.

Qeydiyyat haqlarını tənzimləyin: Seçdiyiniz bütün müraciətləri dərc etmək üçün 25 avrodan bir ödəmə !

Hesabınıza aid məlumatlara məlumat verin: geliştirici adı, e-poçt ünvanı və telefon nömrəsi.

Bu sualınıza cavab verdi ?

Şərhlərinizə görə təşəkkür edirəm şərhlərinizi təqdim etmək üçün bir problem var idi. zəhmət olmasa bir az sonra yenə cəhd edin.

9 Noyabr 2021-ci ildə son yeniləmə

Əlaqəli məqalələr

• Google Play Konsolunda bir tətbiq yaradın
• Android P12 Sertifikatını yaradın
• APK və ya AAB faylını ixrac edin
• Bir Android tətbiqini dərc edin
• Play Store xaricində bir Android tətbiqini dərc edin
• Google Play Store-da yayımlayın

MDC-102: Maddi quruluş və layout

Maddi komponentlər (MDC) inkişaf etdiricilərə maddi dizayn tətbiq etməyə kömək edir. Google, MDC-də bir mühəndis və istifadəçi təcrübəsi mütəxəssisləri tərəfindən hazırlanmışdır, MDC onlarla zərif və funksional istifadəçi interfeysi təklif edir. Android, iOS, internet və çırpınma üçün mövcuddur.material.İo / inkişaf etmək.

MDC-101 Proqramlaşdırma Seminarında, bir əlaqə səhifəsi yaratmaq üçün iki maddi komponent elementlərindən istifadə etdiniz: “Mürəkkəb” animasiyalarından ibarət mətn sahələri və düymələri. Bu əsaslarda, naviqasiya, quruluş və məlumat əlavə edərək tətbiqimizi zənginləşdirək.

Seminar məqsədləri

Bu proqramlaşdırma seminarında, bir ev ekranı yaradacaqsınız Türbə, Ev üçün geyim və əşyaların satışı üçün bir e-ticarət tətbiqi. Bu ekranda:

• Daha yüksək tətbiq çubuğu
• Bir grid şəklində məhsulların siyahısı

Unutmayın ki, bu proqramlaşdırma seminarı, ekran görüntüləri istisna olmaqla, material 3 ilə əvəz olundu. Buna baxmayaraq eyni məlumatları çatdırdılar.

Bu proqramlaşdırma seminarı, ziyarətgah adlı bir məhsul üçün bir tətbiq yaratmağa kömək edəcək dörd seminarın ikincisidir. Sifarişdə bütün proqramlaşdırma seminarlarını izləməyi, kiçik bir şəkildə irəliləməyinizi tövsiyə edirik. Burada proqramlaşdırma seminarlarınızı tapacaqsınız:

• MDC-101 çırpıntı: Maddi komponentlərin əsas prinsipləri
• MDC-103 çırpınır: Material dizaynının mövzularından istifadə (rəng, formalar, yüksəklik və növ)
• MDC-104 Çırpınma: Qabaqcıl material dizayn komponentləri

Bu proqramlaşdırma seminarında material çırpınma materialları və alt sistemləri

• Yuxarı
• Izgazlamaq
• Kartlar

Bu proqramlaşdırma seminarında, material çırpınması ilə təmin edilmiş standart komponentlərdən istifadə edəcəksiniz. Onları MDC-103 hissəsində düzəltməyi öyrənəcəksiniz: Material dizaynının mövzularından istifadə edin (rəng, formalar, yüksəklik və növ).

Flutter ilə inkişaf təcrübənizi necə qiymətləndirərdiniz ?

2-ci. Çırpınma inkişafı mühitini konfiqurasiya edin

Bu seminar üçün, iki proqrama ehtiyacınız var: çırpınma sdk və bir naşir.

Proqramlaşdırma seminarını aşağıdakı cihazlardan birinə keçirə bilərsiniz:

• Kompüterinizə qoşulmuş və inkişaf etdirici rejimində quraşdırılmış bir Android və ya fiziki iOS cihazı.
• İOS simulyatoru (quraşdırmaq üçün xcode alətləri).
• Android Emulator (Android studiyasında konfiqurasiya edilməlidir).
• Bir brauzer (sökmək üçün xrom tələb olunur).
• Windows, Linux və ya Macos masaüstü kimi. Tətbiqinizi yerləşdirməyi planlaşdırdığınız platformada inkişaf etdirməlisiniz. Məsələn, Windows masaüstü tətbiqi inkişaf etdirmək istəyirsinizsə, müvafiq tərtib zəncirinə daxil olmaq üçün bunu Windows-da etməlisiniz. Sənədlərdə detallı olan əməliyyat sistemləri üçün xüsusi tələblər barədə də məlumat əldə edin.çiymək.Dev / masaüstü.

3-cü. Proqramlaşdırma seminarları üçün Gediş tətbiqini yükləyin

Artıq MDC-101 seminarını izləmisiniz ?

MDC-101 proqramlaşdırma seminarını bitirmisinizsə, kodunuz bu seminar başlamağa hazır olmalıdır. Növbəti mərhələyə keçin: Daha yüksək tətbiq çubuğu əlavə edin.

Sıfırdan başlayırsan ?

Başlanğıc Seminar Gediş Tətbiqini yükləyin

Başlanğıc tətbiqi material-komponent-flutter-kodelabs-102-starter_and_101-tam / mdc_100_series .

… və ya Github-dan seminar bağlayın

Bu proqramlaşdırma seminarını Github-dan klonlaşdırmaq üçün aşağıdakı əmrləri işə salın:

Git klon https: // github.COM / Material-komponentlər / material-komponentlər-çırpınan-kodelablar.Git CD material-komponentləri-çırpınan kodelablar / mdc_100_series git yoxlama 102-starter_and_101-tam

Kömək üçün Github-dan klonlama hissəsinə baxın

Düzgün filial seçin

104-də MDC-101 proqramlaşdırma seminarları bir-birinə etibar edir. Beləliklə, MDC-102 seminarının kodu bitirdikdə, MDC-103 seminarının başlanğıc koduna çevrilir. Kod bu əmrdən istifadə edərək siyahını göstərə biləcəyiniz bir neçə filiala bölünür:

GIT filialı – siyahı

Hazır kodu göstərmək üçün, 103 başlanğıc_and_102-in tam filialına keçin .

Layihəni açın və tətbiqi icra edin

1. Seçdiyiniz naşirdə layihəni açın.
2. Seçdiyiniz naşirlə əlaqəli təlimatları izləyin. Başlanğıcda “Tətbiqi işə salın” abzasına (tətbiqin icraçı) üçün əlçatandır. Test sürücüsü səhifəsi (ilk addımlar).

Müvəffəqiyyətli əməliyyat. MDC-101 Proqramlaşdırma seminarından ziyarətgah bağlantısı səhifəsi cihazınızda göstərilməlidir.

İndi əlaqə ekranı yerindədir, tətbiqə bəzi məhsullar əlavə edək.

4-ə. Daha yüksək tətbiq çubuğu əlavə edin

Bu anda, “Next” düyməsini basarsanız, ana ekranı “etdin” mesajı ilə göstərilir!”(Uğur qazandın.)). Mükəmməlləşdirmək. Bununla birlikdə, istifadəçimizin heç bir əlaqəsi yoxdur və tətbiqdə harada olduğunu bilmir. Sizə kömək etmək üçün naviqasiya əlavə etmək vaxtı gəldi.

Orada naviqasiya İstifadəçilərin bir tətbiqdə gəzməsinə imkan verən komponentlər, qarşılıqlı təsirlər, vizual göstəricilərə və informasiya memarlığına aiddir. Bu məzmun və xüsusiyyətləri tapmaq və tapşırıqları asanlıqla yerinə yetirmək imkanı verir.

Daha çox məlumat əldə etmək üçün maddi dizayn təlimatlarında naviqasiyaya həsr olunmuş məqaləyə məsləhətləşin.

Material dizaynı, istifadənin asan rahatlığını təmin edən naviqasiya formatlarını təklif edir. Ən görünən komponentlərdən biri yuxarı tətbiqetmə çubuğudur.

Bu elementi iOS altında və ya sadəcə “Tətbiq çubuğu” və ya “başlıq” adlı “naviqasiya çubuğu” adına görə bilərsiniz.

İstifadəçilərə digər hərəkətlərə sürətli girişi təklif etmək üçün daha yüksək tətbiq çubuğu əlavə edək.

Bir AppBar Widget əlavə edin

Evdə.Dart, “Scaffold” üçün bir appBar əlavə edin, sonra da vurğuladılar:

Gest Sorst Scaffold (// Todo: App Bar əlavə edin (102) AppBar: AppBar (// Todo: Düymələr və başlıq əlavə edin (102)), 

ƏlavəAppbar AppBar sahəsində: İskeleing, proqramın yuxarı hissəsində və bədənin altındakı tətbiq çubuğunu tərk edərək mükəmməl və pulsuz bir nizam əldə etməyə imkan verir.

İskele MaterialApps-da vacib bir widgetdır. Panellər, “Snackbar” bildiriş çubuğu və alt təbəqə elementləri kimi hər cür cari məsələlərin komponentlərini göstərmək üçün praktik API təmin edir. Hətta üzən bir hərəkət düyməsinin yerləşdirilməsini asanlaşdırır.

Scaffold haqqında daha çox məlumat əldə etmək üçün çırpıntı sənədlərinə müraciət edin.

Layihəni qeyd edin. Türbə yeniləndikdən sonra vurun Sonrakı (Aşağıdakı) ev ekranı göstərmək üçün.

Element yaxşı yerləşdirilib, amma başlığı yoxdur.

Bir mətn vidjeti əlavə edin

Evdə.Dart, AppBar tətbiqi çubuğuna başlıq əlavə edin:

// todo: app çubuğu (102) AppBar əlavə edin (// todo: düymələri və başlıq əlavə edin (102) başlığı əlavə edin: Const Mətn ('Todo'), // Todo: Arxa düymələri əlavə edin (102) 

Layihəni qeyd edin.

Hər platforma üçün dəyişiklikləri görmüş ola bilərsiniz. Maddi dizayn sistemi hər platformanın (android, iOS, veb) fərqli olduğunu və istifadəçi gözləntilərinin fərqli olduğunu nəzərə alır. Məsələn, iOS-da başlıqlar demək olar ki, həmişə mərkəzləşmişdir. Bu Uikit tərəfindən verilən standart davranışdır. Android-də, onlar solda düzülmüşdür. Buna görə, bir emulator və ya bir Android cihazından istifadə etsəniz, başlığınız solda uyğunlaşdırılmalıdır. Bir simulyator və ya iOS cihazı vəziyyətində, mərkəzləşdirilməlidir.

Daha çox məlumat əldə etmək üçün maddi dizayn ilə müxtəlif platformalara uyğunlaşma barədə bu məqaləyə məsləhətləşin.

Bir çox tətbiq barlarında başlığın yanında bir düymə var. Tətbiqimizə bir menyu simgesini əlavə edin.

Xəttin əvvəlində bir Iconbutton düyməsini əlavə edin

Həmişə evdə.Dart, aparıcı sahə üçün bir iConbutton elementini təyin edin: AppBar tətbiqi çubuğunun. (Başlıq sahəsindən əvvəl qoyun: xəttin sonuna başlanğıcdan başlanğıcda):

 // todo: Düymələr və başlıq əlavə edin (102) aparıcı: IconButton (Icon: Const Icon (Icons).Menyu, Semantiklabel: 'Menyu',), Dürüst: () < print('Menu button'); >, )), 

Layihəni qeyd edin.

Menyu simgesi (“Hamburger” adlanır), istədiyiniz yerdə görünür.

Sinif İconbutton Material nişanlarını tətbiqinizə birləşdirmək üçün praktik bir yoldur. Bir widget istifadə edir Nişan. Flutter, sinifdə tam nişanlar toplusuna malikdir Nişanlar. Nişanlar avtomatik olaraq “const” kanal xəritələrinə görə idxal olunur.

Nişanlar sinfi haqqında daha çox məlumat əldə etmək üçün, flutter sənədlərinə baxın. Icon Widget haqqında daha çox məlumat əldə etmək üçün çırpıntı sənədlərinə baxın.

Xəttin sonunda düymələri də əlavə edə bilərsiniz. Çırpınca bu düymələr “hərəkətlər” adlanır.

Şərt Başlanğıc Və Bitirmək əlaqəli dildən asılı olmayaraq oxumağın mənasını ifadə edir. İngilis dili kimi soldan sağa bir dil oxuduğunuzda, Başlanğıc varlıq sola Və Bitirmək varlıq sağda. Tərəfdən, termini kimi sağa-sola oxuyan bir dildə Başlanğıc varlıq sağda, Və Bitirmək varlıq sola.

İstifadəçi interfeysinin tərsinə daha çox məlumat əldə etmək üçün, iki istiqamətli material dizayn təlimatlarına müraciət edin.

Hərəkətlər əlavə edin

Digər iki iconbutton elementi üçün kifayət qədər yer var.

Başlıqdan sonra onları AppBar instansiyasına əlavə edin:

// todo: arxada düymələr əlavə edin (102) hərəkətlər: [IconButton (Icon: Const Icon (Icons).Axtarış, semantiklabel: 'Axtar',), ontpresd: () < print('Search button'); >, ), IconButton (Icon: Const Icon (nişanlar).Tune, SemanticLabel: 'Filtr',), OnPresd: () < print('Filter button'); >, ),], 

Layihəni qeyd edin. Əsas ekranınız aşağıdakı kimi yaranmalıdır:

Artıq tətbiqin xəttin başlanğıcındakı bir düymə, başlıq və sağdakı iki hərəkət var. Tətbiq çubuğunun da təsiri varyüksəklik məzmunun fərqli bir səviyyədə olduğunu göstərən bir az kölgə səbəbindən.

Bir simge sinifində, sahə Semantiklabel çırpmaq üçün əlçatanlıq məlumatı əlavə etmək üçün ümumi bir yoldur. Bu, Android məzmunu sözləri və iOS-a giriş qabiliyyəti funksionallığı üçün çox yaxın bir sistemdir . Bunu bir çox kursda tapa bilərsiniz.

Bu sahədə olan məlumatlar bu düymənin rolu barədə ekran oxucuları haqqında məlumat verməyə imkan verir.

Bir widget’ın semantiklabel sahəsi yoxdursa:, onu bir widget içində əhatə edə bilərsiniz Semantika. Semantika vidjeti haqqında daha çox məlumat əldə etmək üçün, çırpıntı sənədlərinə baxın.

Əqrəb. Bir torda bir vərəq əlavə edin

İndi tətbiqimiz bir az daha qurulmuşdur, fayllara qoyaraq məzmununu təşkil edək.

Bu kartlar müəyyən bir mövzu ilə əlaqəli məzmun və hərəkətləri göstərən müstəqil elementlərdir. Bənzər məzmunu kolleksiya şəklində təqdim etmək üçün çevik bir yol təqdim edirlər.

Daha çox məlumat üçün, material dizayn təlimatlarında fayllara həsr olunmuş məqaləyə baxın.

Kart widget (təbəqə) haqqında daha çox məlumat əldə etmək üçün, çırpınmada düzenlərin yaradılması haqqında məqaləyə müraciət edin.

Bir GridView Widget əlavə edin

Üst tətbiq çubuğunun altında bir vərəq əlavə edərək başlayaq. Hal hazırda widget Kart (Vərəq) özünüzü görünən şəkildə yerləşdirmək üçün kifayət qədər məlumat yoxdur. Buna görə də onu bir widget içində qiymətləndirəcəyik Gridview.

Bir gridview widget ilə mərkəzin gövdəsinin bədənindəki mərkəzi dəyişdirin:

// todo: bir grid görünüşü əlavə edin (102) bədən: Gridview.Sayı (CrossaxIscount: 2, Padding: Const Edginsts.Hamısı (16).0), Childaspectratio: 8.0/9.0, // todo: Kartların bir şəbəkəsi (102) Uşaqlar: [kart ()],),), 

Bu kodu təhlil edək. Qızıl Widget istehsalçı sayını çağırır (), çünki göstərdiyi elementlərin sayı sayıla bilər və sonsuz deyil. Lakin onun düzeni müəyyənləşdirmək üçün əlavə məlumat lazımdır.

CrossaxIscount dəyişən: Hər sətirdə elementlərin sayını göstərir. İki sütunu almaq istəyirik.

L ‘transversal ox Çırpma içində diyirləmədiyimiz oxa uyğundur. Sürüşmə hissi deyilir əsas ox. Şaquli sürüşmə istifadə edirsinizsə, Gridview ilə standart hal kimi, eninə ox üfüqidir.

Daha çox məlumat əldə etmək üçün, sxemlər yaratmağa həsr olunmuş səhifəyə baxın.

Padding sahəsi: Gridview widgetının dörd tərəfində boş bir yer təyin edir. Əlbətdə ki, bu marj elementin nəticəsi olaraq görünmür, çünki bu anda bu elementin yanında bir uşaq gridview hələ yerləşdirilməyib.

UşaqApto sahəsi: Proqramların ölçüsünü nisbətdə (hündürlüyə eni) şəklində müəyyənləşdirir.

Varsayılan olaraq, Gridview eyni ölçülü bloklar yaradır.

Bir vərəqimiz var, amma boşdur. Uşaq vidjetlərini bu vərəqə əlavə edin.

Məzmunu qoymaq

Vərəqələrə bir görüntü, başlıq və orta mətn üçün sahələri daxil etməlidir.

Uşaqları Gridview Widget-dən yeniləyin:

// todo: Kartların bir şəbəkəsi (102) Uşaqlar: [Kart (Clipbehavior: Klip.Antialias, Uşaq: Sütun (Crossaxisualignment: Crossaxisualignment.Başlayın, Uşaqlar: [Aspektratio (Aspektratio: 18).0/11.0, uşaq: şəkil.Aktiv ('Aktivlər / Diamond.png '),), padding (padding: const kənarları.fromltrb (16).0, 12.0, 16.0, 8.0), uşaq: sütun (Crossaxisualignment: Crossaxisualignment.Başlayın, uşaqlar: [Mətn ('başlığı'), Const ölçülü (hündürlük: 8).0), mətn ('ikincil mətn'),),),),),)]], 

Bu kod, uşaqların vidjetlərinin şaquli olaraq olmasına imkan verən bir sütun widget (sütun) əlavə edir.

Crossaxisualignment parametri: sahə çarpazlaşmalar dəyərini göstərir.”Sinifin” “Side ”” adlı mətni hizalamaq “deməkdir.

Vidjet Aspekt nisbəti Göstərilən görüntü növündən asılı olmayaraq göstərilən görüntünün nisbətlərini müəyyənləşdirir.

Element Paddend Mətn üçün bir marjanı təyin edir.

İki widget Mətanət digərinin yuxarıdakı birinin yuxarıdan səkkiz boş yer nöqtəsi ilə ayrılır və ayrılır (Ölçülü)). Başqa bir element yaradırıq Sütun onlara daxili marjalar vermək.

Layihəni qeyd edin.

Bu baxışda, vərəqin bir marj ilə yerləşdirildiyini görə bilərsiniz, küncləri yuvarlaqlaşdırılır və kölgə (yüksəkliyini təmsil edən) layihələri həyata keçirir. Bütün forma maddi dizayn sistemində “konteyner” adlanır (konteyner adlı widget sinfi ilə qarışıq olmamalıdır).

Konteynerdən başqa, təbəqələrin bütün elementləri materialda isteğe bağlıdır. Başlıq mətni, bir stiker və ya bir avatar, altyazı mətni, ayırıcılar və hətta pimples və nişanlar əlavə edə bilərsiniz.

Vərəqlərin məzmunu haqqında daha çox məlumat əldə etmək üçün bu məqalədə material dizayn təlimatlarında məsləhətləşin.

Vərəqələr ümumiyyətlə digər təbəqələr olan bir kolleksiya içərisində göstərilir. Onları bir şəbəkədə bir kolleksiya şəklində təşkil edin.

Əqrəb. Fayllar toplusu yaradın

Bir ekranda bir neçə vərəq olduqda, onlar bir və ya daha çox kolleksiyada qruplaşdırılmışdır. Bir kolleksiyanın faylları coplanardır: istirahətdə bütün eyni yüksəkliklərə malikdirlər (bu da burada olmayacağıq və ya köçürülmədikləri zaman söyləmək və ya köçdükləri zaman).

Fayllar toplusu yaradın

Bu an, təbəqə uşaqların içərisində yerləşdirilib: Gridview Grid. Bu, oxumaq çətin ola biləcək çox sayda yuva koduna səbəb olur. Kodun bu hissəsini zəruri hallarda çox boş vərəq qurmağa və faylların siyahısını qaytarmağa imkan verən bir funksiyaya çevirək.

Qurulma () funksiyasından yuxarı xüsusi bir funksiya yaradın (Unutma xətti ilə başlayan funksiyaların özəl API-dir):

// todo: Kartlar toplusu (102) siyahısı _buildgridcards (int sent) < Listcards = List.generate( count, (int index) < return Card( clipBehavior: Clip.antiAlias, child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ AspectRatio( aspectRatio: 18.0 / 11.0, child: Image.asset('assets/diamond.png'), ), Padding( padding: const EdgeInsets.fromLTRB(16.0, 12.0, 16.0, 8.0), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: const [ Text('Title'), SizedBox(height: 8.0), Text('Secondary Text'), ], ), ), ], ), ); >, );; Qayıdış kartları; > 

Gridview Widget’in Uşaqlar sahəsində yaradılan faylları təyin edin. unutma Bu yeni kodla Gridview Widget-də olan bütün elementləri dəyişdirin :

// todo: bir grid görünüşü əlavə edin (102) bədən: Gridview.Sayı (CrossaxIscount: 2, Padding: Const Edginsts.Hamısı (16).0), Childaspectratio: 8.0/9.0, uşaqlar: _buildgridcards (10) // dəyişdirin), 

Layihəni qeyd edin.

Kartlar mövcuddur, lakin bu an üçün heç bir şey göstərmirlər. Məhsul məlumatlarını əlavə etmək üçün vaxt gəldi.

Məhsul məlumatları əlavə edin

Tətbiqdə şəkillər, adlar və qiymətləri olan bəzi məhsullar var. Bunu artıq mövcud olan widgetlara əlavə edin

Sonra evdə.Dart, yeni bir paket və məlumat modeli üçün təqdim olunan bəzi faylları idxal edin:

İdxal 'paketi: çırpınır / material.Dart '; İdxal 'paketi: intl / intl.Dart '; İdxal 'model / məhsul.Dart '; İdxal 'Model / Products_Repository.Dart '; 

Nəhayət, məhsul məlumatlarını əldə etmək və bu məlumatları fayllarda istifadə etmək üçün _buildgridcards () dəyişdirin:

// todo: Kartlar toplusu (102) // Bu metod siyahısını dəyişdirin _buildgridcards (BuildContext kontekstində) < Listproducts = ProductsRepository.loadProducts(Category.all); if (products.isEmpty) < return const []; > Final Themedata Tema = Tema.(kontekst); Son NumberFormat Formatter = NumberFormat.Simplecurrent (yerli: otaqlar).Yerli (kontekst).tostring ()); Qayıdış məhsulları.Xəritə ((məhsul) < return Card( clipBehavior: Clip.antiAlias, // TODO: Adjust card heights (103) child: Column( // TODO: Center items on the card (103) crossAxisAlignment: CrossAxisAlignment.start, children: [ AspectRatio( aspectRatio: 18 / 11, child: Image.asset( product.assetName, package: product.assetPackage, // TODO: Adjust the box size (102) ), ), Expanded( child: Padding( padding: const EdgeInsets.fromLTRB(16.0, 12.0, 16.0, 8.0), child: Column( // TODO: Align labels to the bottom and center (103) crossAxisAlignment: CrossAxisAlignment.start, // TODO: Change innermost Column (103) children: [ // TODO: Handle overflowing labels (103) Text( product.name, style: theme.textTheme.titleLarge, maxLines: 1, ), const SizedBox(height: 8.0), Text( formatter.format(product.price), style: theme.textTheme.titleSmall, ), ], ), ), ), ], ), ); >)).Tolist (); > 

Görkəmli : Tərtib və icra başlamazdan əvvəl gözləyin. Etmək üçün bir dəyişiklik qalır.

Mətni formatlaşdırmaq üçün mövzu məlumatlarından istifadə edirik Tempertaj dəyərdən Bukun cərəyan.

Mətnin biçimlendirilməsi haqqında daha çox məlumat əldə etmək üçün Material Dizayn Təlimatlarında Tipoqrafiya haqqında məqaləyə müraciət edin. Bir mövzudan formatlaşdırma haqqında daha çox məlumat əldə etmək üçün, MDC-103 ilə bu proqramlaşdırma seminarından sonra davam edin: Material dizaynı mövzularından istifadə (rəng, formalar, yüksəklik və növ).

Dəyəri ötürmək üçün qurma () funksiyasını da dəyişdirin Bukun _buildgridcards-da () tərtib edilmədən əvvəl:

// todo: bir grid görünüşü əlavə edin (102) bədən: Gridview.Sayı (CrossaxIscount: 2, Padding: Const Edginsts.Hamısı (16).0), Childaspectratio: 8.0/9.0, uşaqlar: _buildgridcards (kontekst) // dəyişdirmə kodu dəyişdirin), 

İsti tətbiqetməni yenidən başladın.

Fayllar arasında şaquli boşluq əlavə etmədiyimizi görə bilərsiniz. Çünki yuxarı və alt tərəfindən dörd kənarı var.

Layihəni qeyd edin.

İstehsal olunan məlumatlar göstərilir, lakin şəkillər lazımsız bir məkan ilə əhatə olunmuşdur. Varsayılan olaraq, şəkillər sahə ilə çəkilir Boksfit müəyyən .Scaledown (bu vəziyyətdə). Bu dəyəri dəyişdirin .Cəlbedici məkanı böyütmək və çıxarmaq üçün uyğun bir şey.

Fit sahəsini əlavə edin: Boxfit dəyəri kimi.FITTURTH:

 // todo: qutu ölçüsünü tənzimləyin (102) uyğunluq: boxfit.uyğuntanlıq, 

Məhsullarımız indi tətbiqdə mükəmməl şəkildə göstərilir.

7-yə. Təbrik edirik !

Tətbiqimiz, istifadəçiyə Bağlantı Ekranından məhsulların göründüyü bir ana ekrana keçməsinə imkan verən əsas əməliyyat təklif edir. Daha yüksək bir tətbiq çubuğu (başlığı və üç düymə ilə) və faylları (tətbiqimizin məzmununu təqdim etmək üçün) bir neçə kod xətti kifayət idi. Əldə olunan ana ekran sadə və işləkdir və əsas quruluşa və istifadəyə yararlı bir məzmun var.

MDC-102 tətbiqinin tamamlanmış versiyası 103 başlanğıc_and_102-in tam filialında mövcuddur .

Bu filialın tətbiqi ilə versiyanızı səhifədə müqayisə edə bilərsiniz.

Aşağıdakı addımlar

Tətbiq çubuğu, vərəq, mətn sahəsi və səhifənin yuxarısında yerləşən düymə ilə, artıq material çırpınma kitabxanasının dörd əsas komponentindən istifadə etdik. Daha çox məlumat əldə etmək üçün maddi komponentlərin kataloquna baxın.

Tətbiqimiz mükəmməl işləyirsə də, marka kimliyini və ya müəyyən bir nöqtəni əks etdirmir. MDC-103 seminarında: Material dizaynı mövzularından istifadə (rəng, formalar, yüksəklik və növ), bu komponentlərin tərzini müasir və dinamik bir marka ifadə etmək üçün fərdiləşdirəcəyik.

Bu proqramlaşdırma seminarının reallaşdırılması məndən bir müddət və ağlabatan səylər istədi

Tamamilə razıyam

Nə razı deyil, nə də razılaşmır

hər şeyə razı deyiləm

Maddi komponentlərdən istifadə etməyə davam etmək istəyirəm

Tamamilə razıyam

Nə razı deyil, nə də razılaşmır

hər şeyə razı deyiləm

Başqa bir şəkildə göstərilmədiyi təqdirdə, bu səhifənin məzmunu yaradıcı bir Commons Təyinatı 4 lisenziya ilə idarə olunur.0 və kod nümunələri Apache 2 lisenziyası ilə idarə olunur.0. Daha çox məlumat üçün, Google Yaradıcılar saytının qaydalarına baxın. Java, Oracle və / və ya Affiliated şirkətlərinin qeydə alınmış ticarət nişanıdır.