Делите путем

Приказ, сортирање и филтрирање података у галерији апликације са подлогом

  • Чланак

Направите галерију за приказ слика и текста о неколико производа и сортирајте и филтрирајте те информације.

У Power Apps можете да користите галерију за приказ неколико повезаних ставки, баш као што видите у каталогу. Галерије су одличне за приказивање информација о производима, попут назива и цена. У овој теми креирамо галерију и сортирамо и филтрирамо информације користећи функције као у програму Excel. Такође, када је изабрана ставка, око ње се поставља ивица.

Напомена

Ова тема користи апликацију за таблете. Можете да користите апликацију за телефон, али ћете морати да промените величину неких контрола.

Предуслови

  • Региструјте се за Power Apps, а затим се пријавите помоћу истих акредитива које сте користили за регистрацију.
  • Креирајте апликацију за таблет помоћу предлошка, података или из почетка.
  • Сазнајте како да конфигуришете контролу.
  • Ови кораци користе опцију CreateFirstApp као пробне улазне податке који укључује .jpg слике. Датотека zip укључује XML датотеку која се може конвертовати у Excel. У супротном, Power Apps аутоматски чита датотеке у .zip датотекама и успешно их увози. Можете преузети и користити ове пробне податке или увести своје.

  1. Креирајте колекцију по имену Инвентар користећи пробне податке. У кораке спада следеће:

    1. На картици Уметање изаберите Контроле, а затим изаберите Увези.

      Контрола за уметање

    2. Подесите својство OnSelect за контролу увоза на следећу формулу:
      Collect(Inventory, Import1.Data)

      Својство OnSelect

    3. Изаберите дугме Увези податке да бисте отворили Windows Explorer. Изаберите CreateFirstApp.zip, а затим Отвори.

    4. У менију Датотека изаберите Колекције. Колекција Инвентар је наведена са подацима које сте увезли:

      Датотека – колекције

      Управо сте креирали колекцију инвентара која садржи информације о пет производа, укључујући дизајнерску слику, назив производа и број јединица на лагеру.

      Напомена

      Контрола увоза се користи за увоз података налик подацима из програма Excel и креирање колекције. Контрола увоза увози податке током креирања апликације и прегледа апликације. Тренутно контрола увоза не увози податке када објавите апликацију.

  2. Изаберите стрелицу за повратак да бисте се вратили у дизајнер.

  3. На картици Уметање кликните или додирните Галерија, а затим кликните или додирните галерију Хоризонтално.

    Галерија – хоризонтална

  4. У десном окну кликните или додирните опцију у којој наслов и поднаслови прекривају графику:

    Распоред

  5. Подесите својство галерије Ставке на Инвентар:

    Изглед галерије

  6. Преименујте галерију у ProductGallery и преместите галерију да не бисте блокирали остале контроле. Промените величину галерије тако да приказује три производа:

    Преименовање галерије

  7. У првој ставци галерије изаберите доњу налепницу:

    Апликација са галеријом

    Напомена

    Када промените прву ставку у било којој галерији, аутоматски мењате и све остале ставке у галерији.

  8. Поставите својство Текст за ознаку у следећи израз:
    ThisItem.UnitsInStock

    Када то урадите, налепница приказује јединице на складишту за сваки производ:

Залиха сваког производа

Напомена

Подразумевано је својство Текст горње ознаке постављено на ThisItem.ProductName. Ово можете променити у било коју другу ставку у вашој колекцији. На пример, ако ваша колекција има поља Опис производа или Цена, можете поставити ознаку на ThisItem.ProductDescription или на ThisItem.Price.

Помоћу ових корака увезете податке који укључују .jpg слике у колекцију. Затим сте додали галерију која приказује податке и конфигурисали ознаку за приказ јединица на залихама за сваки производ.

  1. Изаберите било коју ставку у галерији осим прве. Приказује се икона за уређивање (горњи леви угао). Изаберите икону за уређивање:
    Уређивање

  2. На картици Уметање изаберите Облици, а затим изаберите правоугаоник. Плави чврсти правоугаоник појављује се у свакој ставци галерије.

  3. На картици Почетак изаберите Попуна, а затим изаберите Без попуне.

  4. Изаберите Ивица, изаберите Стил ивице, а затим изаберите пуну линију.

  5. Поново изаберите Ивица и подесите дебљину на 3. Промените величину правоугаоника тако да окружује ставку галерије. Предмети у вашој галерији сада имају плаву ивицу и требало би да изгледају слично:
    Изаберите ивицу

  6. На картици Облик изаберите Видљиво, а затим унесите следећу формулу у траку формуле:

    If(ThisItem.IsSelected, true)

    Плави правоугаоник окружује тренутни избор у галерији. Изаберите неколико ставки галерије да бисте потврдили да се правоугаоник појављује око сваке ставке коју одаберете. Запамтите, можете и да отворите Преглед дугме за преглед да бисте видели и тестирали оно што креирате.

Савет

Изаберите правоугаоник, изаберите Промени редослед на картици Почетак, а затим изаберите Пошаљи назад. Користећи ову функцију, можете изабрати ставку галерије, а да ивица ништа не блокира.

Користећи ове кораке, додали сте ивицу око тренутног избора у галерији.

У овим корацима ћемо сортирати ставке у галерији у узлазном и силазном редоследу. Такође, додаћемо контролу клизача да бисте „филтрирали“ ставке галерије према јединицама на залихама које одаберете.

Сортирање растућим или опадајућим редоследом

  1. Изаберите било коју ставку у галерији осим прве.

  2. Својство Ставке је тренутно постављено на Инвентар (назив ваше колекције). Промените га у следеће:

    Sort(Inventory, ProductName)

    Када то учините, ставке у галерији се сортирају према називу производа у растућем редоследу: Сортирана галерија

    Испробајте опадајући редослед. Подесите својство галерије Ставке на следећу формулу:

    Sort(Inventory, ProductName, Descending)

  1. Додајте контролу клизача (картица Уметање > Контроле), преименујте је у StockFilter и преместите је испод галерије.

  2. Конфигуришите клизач тако да га корисници не могу поставити на вредност изван распона јединица на залихама:

    1. На картици Садржај изаберите Мин., а затим унесите следећи израз:
      Min(Inventory, UnitsInStock)
    2. На картици Садржај изаберите Макс., а затим унесите следећи израз:
      Max(Inventory, UnitsInStock)

  3. Изаберите било коју ставку у галерији осим прве. Подесите својство галерије Ставке на следећи израз:
    Filter(Inventory, UnitsInStock<=StockFilter.Value)

  4. У делу Преглед подесите клизач на вредност која је између највеће и најниже количине у галерији. Док подешавате клизач, галерија приказује само оне производе који су мањи од вредности коју одаберете:
    Преглед галерије са вредношћу клизача

Сада, додајмо у наш филтер:

  1. Вратите се у дизајнер.
  2. На картици Уметање изаберите Текст, изаберите Унос текста и преименујте нову контролу у NameFilter. Померите текстуалну контролу испод клизача.
  3. Подесите својство галерије Ставке на следећи израз:
    Filter(Inventory, UnitsInStock<=StockFilter.Value && NameFilter.Text in ProductName)
  4. У одељку Преглед поставите клизач на 30 и откуцајте слово г у контроли уноса текста. Галерија приказује једини производ са мање од 30 јединица на лагеру и има име са словом „г“:
    Клизач за преглед са вредношћу 30

Савети и трикови

  • У било ком тренутку можете да изаберете дугме за преглед (Слика дугмета за преглед) да бисте видели шта сте креирали и тестирали то.
  • Приликом дизајнирања апликације, можете поново да промените величину контрола и померате их користећи клик и превлачење.
  • Притисните тастер ESC или изаберите X да бисте затворили прозор за преглед.
  • Када користите галерију, изаберите прву ставку у галерији да бисте променили све ставке у галерији. На пример, изаберите прву ставку да бисте додали ивицу свим ставкама у галерији.
  • Да бисте ажурирали својства галерије, изаберите било коју ставку у галерији осим прве. На пример, изаберите другу ставку да бисте ажурирали ставке Ставке, Прикажи клизач и друга својства која се односе на галерију (а не на ставке у галерији).

Шта сте научили

У овој теми сте урадили следеће:

  • Креирали сте колекцију, увезли податке који укључују .jpg слике у ту колекцију и приказали податке у галерији.
  • Под сваком сликом у галерији конфигурисали сте ознаку која наводи јединице на лагеру за ту ставку.
  • Додали сте ивицу око ставке коју сте изабрали.
  • Сортирали сте ставке по називу производа у растућем и опадајућем редоследу.
  • Додали сте клизач и контролу уноса текста за филтрирање производа по јединицама на лагеру и називу производа.

Напомена

Можете ли нам рећи о својим жељеним поставкама језика у документацији? Испуните кратку анкету. (имајте на уму да је ова анкета на енглеском језику)

Анкета ће трајати око седам минута. Не прикупљају се лични подаци (изјава о приватности).