Piezīme. Šī raksta pamatā bija Materiālu komponentu versija 1.2.0-beta01 no 2020. gada 1. jūnijs .



Trīs ar pusi gadu laikā, kad strādāju nelielā Android komandā HASHTAGS, viena no galvenajām lietām, kas mani motivē sākt strādāt katru dienu, ir mūsu uzņēmuma brīvība un uzticība risināt problēmu tādā veidā, kādu mēs uzskatām par labāko.



Brīvība pētīt un izpētīt daudzus dažādus risinājumus problēmai, kuru mēs uzskatām par nepieciešamu, vienlaikus ņemot vērā laika periodu produktu atjauninājumu nodrošināšanai, ļauj mums atrast labāko risinājumu gan mūsu klientiem, gan mūsu programmatūrai.

Viens no šādiem izaicinājumiem bija lietotāja saskarnes komponenta izveide mūsu jaunajai mobilo pārskatu funkcijai. Šis jaunais komponents bija mēneša atlasītājs, kas mūsu lietotājiem ļāva noteikt analīzes pārskata datumu diapazonu.

Sākuma vieta, kuru izvēlējāmies, bija esošā Materiālu komponentu bibliotēka . Tā vietā, lai sāktu no nulles, šī bibliotēka tiek aktīvi uzturēta un saskaņota ar Materiālu specifikācijām. Izmantojot šo bibliotēku kā pamatu, mēs, visticamāk, varētu samazināt loģikas apjomu, kas mums būtu jāraksta pašiem.

Šajā rakstā es apskatīšu, kā mēs tuvojāmies šim procesam, dažus unikālus faktorus, veidojot Android lietotni Sprout, dažus “gotčus”, kas parādījās (un tika fiksēti) un ko zināt, vai esat strādājot pie līdzīga projekta.

Ievads

Android materiālu komponenti 1.1.0 atbrīvošana ieviesa jaunu datumu atlasītāja lietotāja saskarnes komponentu. Viens no šī jaunā MaterialDatePicker apsveicamajiem papildinājumiem pār AppCompat CalendarView ir iespēja izvēlēties datumu diapazonu, izmantojot kalendāra skatu vai teksta ievades lauku.



Vecais AppCompat CalendarView nebija ļoti elastīgs. Tas bija labs komponents ierobežotas lietošanas gadījumam, kuru bija paredzēts atrisināt; tas ir, izvēloties vienu datumu un izvēles minimālos un maksimālos datumus, lai norādītu atļauto datumu diapazonu.

Jaunais MaterialDatePicker tika veidots ar lielāku elastību, lai ļautu izmantot izvērstu uzvedības funkcionalitāti. Tas darbojas, izmantojot vairākas saskarnes, kuras varētu ieviest, lai pielāgotu un mainītu atlasītāja rīcību.

Šī uzvedības modifikācija tiek veikta izpildlaikā, izmantojot MaterialDatePicker.Builder veidotāja modeļa funkciju kopu klasē.



Tas nozīmē, ka mēs spējam paplašināt šī MaterialDatePicker pamata uzvedību izmantojot saliekamus saskarnes komponentus.

Piezīme: Lai gan ir vairāki dažādi komponenti, MaterialDatePicker izmanto, šajā rakstā mēs aplūkosim tikai datuma izvēles komponentu.

3 6 9 numeroloģija

Datumu diapazona atlasītājs

Android komanda HASHTAGS veidoja mūsu Analytics pārskatu sadaļu.

Šī jaunā sadaļa ļaus mūsu lietotājiem izvēlēties filtru kopu un datumu diapazonu kopu, uz kuru attiecas pārskats.

MaterialDatePicker nāca ar dažiem iepriekš uzbūvētiem komponentiem, kurus mēs varētu izmantot, lai paveiktu mūsu lietošanas gadījumu.

Mūsu visizplatītākajā gadījumā, ļaujot lietotājam izvēlēties datumu diapazonu, iepriekš izveidots MaterialDatePicker pietiktu:

Izmantojot šo kodu bloku, mēs iegūstam datumu atlasītāju, kas lietotājiem ļauj izvēlēties datumu diapazonu.

Mēneša datumu atlasītājs

Viens no HASHTAGS ziņojumiem, kuram ir unikālāka datuma izvēle, ir Twitter tendenču pārskats.

Šis pārskats atšķiras no citiem ar to, ka tā vietā, lai atļautu jebkāda veida datumu diapazonu, tajā tiek ieviesta viena mēneša atlase, kas nozīmē, ka lietotājs var atlasīt tikai 2020. gada martu salīdzinājumā ar 3. martu līdz 2020. gada 16. martam.

Mūsu tīmekļa lietotne to risina, izmantojot nolaižamo veidlapas lauku:

MaterialDatePicker nav iespējas ieviest šādu ierobežojumu ar iepriekš izveidoto materiāla datumu diapazona atlasītāju, kas tika apspriests iepriekšējā sadaļā. Par laimi, MaterialDatePicker tika uzbūvēts ar saliekamām daļām, kas ļauj paplašināt noklusējuma darbību mūsu konkrētajā lietošanas gadījumā.

Datuma izvēles uzvedība

MaterialDatePicker piesaista a DateSelector kā saskarni, ko izmanto atlasītāja izvēles loģikai.

No Javadoc:

“Saskarne {@link MaterialCalendar} lietotājiem kontrolēt, kā kalendārs parāda un atgriež atlasi ... ”

Jūs ievērosiet, ka MaterialDatePicker.Builder.dateRangePicker() atgriež celtnieka instanci RangeDateSelector, kuru mēs izmantojām iepriekšējā piemērā.

Šī klase ir iepriekš izveidots selektors, kas īsteno DateSelector

Prāta vētra ikmēneša datuma izvēles uzvedība

Lietošanas gadījumā mēs vēlējāmies, lai lietotāji izvēlētos visu mēnesi kā atlasīto datumu diapazonu; piem. 2020. gada maijs, 2020. gada aprīlis utt.

Mēs domājām, ka iepriekš uzbūvētais RangeDateSelector atsauce uz augstāk mūs aizveda lielāko ceļu. Komponents ļāva lietotājam izvēlēties datumu diapazonu un ieviest a saistīts .

Vienīgais, kas trūka, bija veids, kā ieviest atlasi, lai automātiski atlasītu visu mēnesi. Noklusējuma uzvedība RangeDateSelector liek lietotājam izvēlēties sākuma datumu un beigu datumu.

Mēs vēlējāmies, lai lietotājs izvēlētos dienu mēnesī, pēc tam atlasītājs automātiski izvēlētos visu mēnesi kā datumu diapazonu.

Risinājums, par kuru mēs nolēmām, bija pagarināt RangeDateSelector un pēc tam ignorējiet dienas izvēles uzvedību, lai tā vietā automātiski atlasītu visu mēnesi.

Par laimi ir kāda funkcija, kuru mēs varam ignorēt no saskarnes DateSelector sauca: select(selection: Long).

Šī funkcija tiks izsaukta, kad lietotājs atlasītājā izvēlēsies dienu, un izvēlētā diena būs pagājusi UTC milisekundēs no laikmeta.

Ikmēneša datuma izvēles uzvedības ieviešana

Ieviešana izrādījās vienkāršākā daļa, jo mums ir skaidra funkcija, kuru mēs varam ignorēt, lai iegūtu vēlamo uzvedību.

Pamata loģika būs šāda:

  1. Lietotājs izvēlas dienu.
  2. select() funkcija tiek izsaukta ar izvēlēto dienu a Garš UTC milisekundes no laikmeta.
  3. Atrodiet mēneša pirmo un pēdējo dienu no mums nodotās dienas.
  4. Zvaniet uz super.select(1st of month) & super.select(last day of month)
  5. Vecāku uzvedība no RangeDateSelector jādarbojas, kā paredzēts, un kā datumu diapazonu atlasiet mēnesi.

Saliekot to visu kopā

Tagad, kad mums ir mūsu pielāgotais MonthRangeDateSelector, mēs varam iestatīt savu MaterialDatePicker

Lai turpinātu piemēru, mēs varam apstrādāt atlases rezultātu šādi:

Rezultāts izskatīsies šādi:

Gotčas

Bija tikai viens būtisks jautājums, kas apgrūtināja šī risinājuma nonākšanu.

Galvenie komponenti, ko izmantoja mūsu MonthRangeDateSelector izveidošanai bija klase RangeDateSelector un saskarne DateSelector. Šajā rakstā izmantotā bibliotēkas versija (1.2.0-beta01) ierobežoja šo divu failu redzamību, lai atturētu no to paplašināšanas vai ieviešanas.

Rezultātā, lai arī mēs varētu veiksmīgi apkopot savu jauno MonthRangeDateSelector, kompilators tomēr parādīja ļoti biedējošu brīdinājumu, lai atturētu mūs no tā:

Viens no veidiem, kā paslēpt šo kompilatora brīdinājumu, ir pievienot @Suppress('RestrictedApi') tāpat kā:

Šī pieredze parāda, ka, pat ja Materiālu komponentu bibliotēka ir nodrošinājusi Android izstrādātāju kopienai lieliskus jaunus komponentus, tā joprojām tiek turpināta.

Liela šīs bibliotēkas daļa ir atvērtība atsauksmēm no Android kopienas! Pēc šī komponenta redzamības ierobežojuma atklāšanas es atvēru izdevums par Github projektu un pat atvēra a PR lai to nekavējoties risinātu.

Šī atklātā atgriezeniskā saite starp Material Components komandu un Android kopienu rada lielisku sadarbību un rezultātus visiem.

Secinājums

Jaunais MaterialDatePicker ir dažas izcilas funkcionalitātes, kas, visticamāk, aptvers lielāko daļu datuma izvēles gadījumu.

Tomēr labākā daļa no tā, piemēram, AppCompat CalendarView, ir tā, ka tā ir veidota saliktā veidā. Tādēļ to var viegli paplašināt un modificēt īpašiem lietošanas gadījumiem, turpretī daudz grūtāk ir paveikt šādas lietas CalendarView

Īpašs paldies

Es gribētu izcelt dažus ļaudis, kuri palīdzēja salīdzināt šo rakstu:

Dalieties Ar Draugiem: