Prikaz, sortiranje i filtriranje podataka u galeriji aplikacije sa podlogom

Napravite galeriju za prikaz slika i teksta o nekoliko proizvoda i sortirajte i filtrirajte te informacije.

U Power Apps možete da koristite galeriju za prikaz nekoliko povezanih stavki, baš kao što vidite u katalogu. Galerije su odlične za prikazivanje informacija o proizvodima, poput naziva i cena. U ovoj temi kreiramo galeriju i sortiramo i filtriramo informacije koristeći funkcije kao u programu Excel. Takođe, kada je izabrana stavka, oko nje se postavlja ivica.

Napomena

Ova tema koristi aplikaciju za tablete. Možete da koristite aplikaciju za telefon, ali ćete morati da promenite veličinu nekih kontrola.

Preduslovi

  • Registrujte se za Power Apps, a zatim se prijavite koristeći iste akreditive koje ste koristili za registraciju.
  • Kreirajte aplikaciju za tablet pomoću predloška, podataka ili iz početka.
  • Saznajte kako da konfigurišete kontrolu.
  • Ovi koraci koriste opciju CreateFirstApp kao probne ulazne podatke koji uključuje .jpg slike. Datoteka zip uključuje XML datoteku koja se može konvertovati u Excel. U suprotnom, Power Apps automatski čita datoteke u .zip datotekama i uspešno ih uvozi. Možete preuzeti i koristiti ove probne podatke ili uvesti svoje.

Prikaži podatke u galeriji

  1. Kreirajte kolekciju po imenu Inventar koristeći probne podatke. U korake spada sledeće:

    1. Na kartici Umetanje izaberite Kontrole, a zatim izaberite Uvezi.

      Kontrola za umetanje

    2. Podesite svojstvo OnSelect za kontrolu uvoza na sledeću formulu:
      Collect(Inventory, Import1.Data)

      Svojstvo OnSelect

    3. Izaberite dugme Uvezi podatke da biste otvorili Windows Explorer. Izaberite CreateFirstApp.zip, a zatim Otvori.

    4. U meniju Datoteka izaberite Kolekcije. Kolekcija Inventar je navedena sa podacima koje ste uvezli:

      Datoteka – kolekcije

      Upravo ste kreirali kolekciju inventara koja sadrži informacije o pet proizvoda, uključujući dizajnersku sliku, naziv proizvoda i broj jedinica na lageru.

      Napomena

      Kontrola uvoza se koristi za uvoz podataka nalik podacima iz programa Excel i kreiranje kolekcije. Kontrola uvoza uvozi podatke tokom kreiranja aplikacije i pregleda aplikacije. Trenutno kontrola uvoza ne uvozi podatke kada objavite aplikaciju.

  2. Izaberite strelicu za povratak da biste se vratili u dizajner.

  3. Na kartici Umetanje kliknite ili dodirnite Galerija, a zatim kliknite ili dodirnite galeriju Horizontalno.

    Galerija – horizontalna

  4. U desnom oknu kliknite ili dodirnite opciju u kojoj naslov i podnaslovi prekrivaju grafiku:

    Raspored

  5. Podesite svojstvo galerije Items na Inventar:

    Izgled galerije

  6. Preimenujte galeriju u ProductGallery i premestite galeriju da ne biste blokirali ostale kontrole. Promenite veličinu galerije tako da prikazuje tri proizvoda:

    Preimenovanje galerije

  7. U prvoj stavci galerije izaberite donju oznaku:

    Aplikacija sa galerijom

    Napomena

    Kada promenite prvu stavku u bilo kojoj galeriji, automatski menjate i sve ostale stavke u galeriji.

  8. Postavite svojstvo Text za oznaku u sledeći izraz:
    ThisItem.UnitsInStock

    Kada to uradite, oznaka prikazuje jedinice na skladištu za svaki proizvod:

Zaliha svakog proizvoda

Napomena

Podrazumevano je svojstvo Text gornje oznake postavljeno na ThisItem.ProductName. Ovo možete promeniti u bilo koju drugu stavku u vašoj kolekciji. Na primer, ako vaša kolekcija ima polja Opis proizvoda ili Cena, možete postaviti oznaku na ThisItem.ProductDescription ili na ThisItem.Price.

Pomoću ovih koraka uvezete podatke koji uključuju .jpg slike u kolekciju. Zatim ste dodali galeriju koja prikazuje podatke i konfigurisali oznaku za prikaz jedinica na zalihama za svaki proizvod.

Markirajte stavku galerije koju ste odabrali

  1. Izaberite bilo koju stavku u galeriji osim prve. Prikazuje se ikona za uređivanje (gornji levi ugao). Izaberite ikonu za uređivanje:
    Uređivanje

  2. Na kartici Umetanje izaberite Oblici, a zatim izaberite pravougaonik. Plavi čvrsti pravougaonik pojavljuje se u svakoj stavci galerije.

  3. Na kartici Početak izaberite Popuna, a zatim izaberite Bez popune.

  4. Izaberite Ivica, izaberite Stil ivice, a zatim izaberite punu liniju.

  5. Ponovo izaberite Ivica i podesite debljinu na 3. Promenite veličinu pravougaonika tako da okružuje stavku galerije. Predmeti u vašoj galeriji sada imaju plavu ivicu i trebalo bi da izgledaju slično:
    Izaberite ivicu

  6. Na kartici Oblik izaberite Visible, a zatim unesite sledeću formulu u traku formule:

    If(ThisItem.IsSelected, true)

    Plavi pravougaonik okružuje trenutni izbor u galeriji. Izaberite nekoliko stavki galerije da biste potvrdili da se pravougaonik pojavljuje oko svake stavke koju odaberete. Zapamtite, možete i da otvorite Pregled dugme za pregled da biste videli i testirali ono što kreirate.

Savet

Izaberite pravougaonik, izaberite Promeni redosled na kartici Početak, a zatim izaberite Pošalji nazad. Koristeći ovu funkciju, možete izabrati stavku galerije, a da ivica ništa ne blokira.

Koristeći ove korake, dodali ste ivicu oko trenutnog izbora u galeriji.

Sortiranje i filtriranje stavki u galeriji

U ovim koracima ćemo sortirati stavke u galeriji u uzlaznom i silaznom redosledu. Takođe, dodaćemo kontrolu klizača da biste „filtrirali“ stavke galerije prema jedinicama na zalihama koje odaberete.

Sortiranje rastućim ili opadajućim redosledom

  1. Izaberite bilo koju stavku u galeriji osim prve.

  2. Svojstvo Items je trenutno postavljeno na Inventar (naziv vaše kolekcije). Promenite ga u sledeće:

    Sort(Inventory, ProductName)

    Kada to učinite, stavke u galeriji se sortiraju prema nazivu proizvoda u rastućem redosledu: Sortirana galerija

    Isprobajte opadajući redosled. Podesite svojstvo galerije Items na sledeću formulu:

    Sort(Inventory, ProductName, Descending)

Dodajte kontrolu klizača i filtriranje stavki u galeriju

  1. Dodajte kontrolu klizača (kartica Umetanje > Kontrole), preimenujte je u StockFilter i premestite je ispod galerije.

  2. Konfigurišite klizač tako da ga korisnici ne mogu postaviti na vrednost izvan raspona jedinica na zalihama:

    1. Na kartici Sadržaj izaberite Min., a zatim unesite sledeći izraz:
      Min(Inventory, UnitsInStock)
    2. Na kartici Sadržaj izaberite Maks., a zatim unesite sledeći izraz:
      Max(Inventory, UnitsInStock)
  3. Izaberite bilo koju stavku u galeriji osim prve. Podesite svojstvo galerije Items na sledeći izraz:
    Filter(Inventory, UnitsInStock<=StockFilter.Value)

  4. U delu Pregled podesite klizač na vrednost koja je između najveće i najniže količine u galeriji. Dok podešavate klizač, galerija prikazuje samo one proizvode koji su manji od vrednosti koju odaberete:
    Pregled galerije sa vrednošću klizača

Sada, dodajmo u naš filter:

  1. Vratite se u dizajner.
  2. Na kartici Umetanje izaberite Text, izaberite Unos teksta i preimenujte novu kontrolu u NameFilter. Pomerite tekstualnu kontrolu ispod klizača.
  3. Podesite svojstvo galerije Items na sledeći izraz:
    Filter(Inventory, UnitsInStock<=StockFilter.Value && NameFilter.Text in ProductName)
  4. U odeljku Pregled postavite klizač na 30 i unesite slovo g u kontroli unosa teksta. Galerija prikazuje jedini proizvod sa manje od 30 jedinica na lageru i ima ime sa slovom „g“:
    Klizač za pregled sa vrednošću 30

Saveti i trikovi

  • U bilo kom trenutku možete da izaberete dugme za pregled (Slika dugmeta za pregled) da biste videli šta ste kreirali i testirali to.
  • Prilikom dizajniranja aplikacije, možete ponovo da promenite veličinu kontrola i pomerate ih koristeći klik i prevlačenje.
  • Pritisnite taster ESC ili izaberite X da biste zatvorili prozor za pregled.
  • Kada koristite galeriju, izaberite prvu stavku u galeriji da biste promenili sve stavke u galeriji. Na primer, izaberite prvu stavku da biste dodali ivicu svim stavkama u galeriji.
  • Da biste ažurirali svojstva galerije, izaberite bilo koju stavku u galeriji osim prve. Na primer, izaberite drugu stavku da biste ažurirali stavke Items, ShowScrollbar i druga svojstva koja se odnose na galeriju (a ne na stavke u galeriji).

Šta ste naučili

U ovoj temi ste uradili sledeće:

  • Kreirali ste kolekciju, uvezli podatke koji uključuju .jpg slike u tu kolekciju i prikazali podatke u galeriji.
  • Pod svakom slikom u galeriji konfigurisali ste oznaku koja navodi jedinice na lageru za tu stavku.
  • Dodali ste ivicu oko stavke koju ste izabrali.
  • Sortirali ste stavke po nazivu proizvoda u rastućem i opadajućem redosledu.
  • Dodali ste klizač i kontrolu unosa teksta za filtriranje proizvoda po jedinicama na lageru i nazivu proizvoda.

Napomena

Možete li nam reći o svojim željenim postavkama jezika u dokumentaciji? Ispunite kratku anketu. (imajte na umu da je ova anketa na engleskom jeziku)

Anketa će trajati oko sedam minuta. Ne prikupljaju se lični podaci (izjava o privatnosti).