Zobrazení položek různé výšky v galerii PowerAppsShow items of different heights in a PowerApps gallery

Pokud různé položky ve vaší sadě dat obsahují ve stejném poli různé množství dat, můžete položky obsahující více dat zobrazit celé, aniž byste museli přidávat volné místo za položky, které tolik dat neobsahují.If different items in your data set contain different amounts of data in the same field, you can completely show items that contain more data without adding empty space after items that contain less data. Přidejte a nakonfigurujte ovládací prvek galerie Proměnlivá výška, abyste mohli:Add and configure a Flexible height gallery control so that you can:

  • Konfigurovat ovládací prvky Popisek pro zvětšení nebo zmenšení na základě jejich obsahuConfigure Label controls to expand or shrink based on their contents.
  • Umístit každý ovládací prvek tak, aby se automaticky zobrazil přímo pod ovládacím prvkem nad nímPosition each control so that it automatically appears just under the control above it.

V tomto kurzu zobrazíte data o podlahových produktech v ovládacím prvku galerie Proměnlivá výška.In this tutorial, you show data about flooring products in a Flexible height gallery control. Obrázek každého produktu se zobrazí 5 pixelů pod přehledem, bez ohledu na to, jestli přehled obsahuje pět řádků textu nebo jen dva.The image of each product appears 5 pixels below the overview, whether the overview contains five lines of text or two lines.

Konečná aplikace

Navrhovaná témataSuggested reading

Pokud jste nikdy nepřidávali ovládací prvky do galerie, postupujte podle kroků v části Zobrazení seznamu položek, než budete v tomto tématu pokračovat.If you've never added controls to a gallery, follow the steps in Show a list of items before you proceed in this topic.

Přidání dat do prázdné aplikaceAdd data to a blank app

  1. Stáhněte si tento soubor aplikace Excel obsahující názvy, přehledy a odkazy na obrázky podlahových produktů.Download this Excel file, which contains names, overviews, and links to images of flooring products.

    Podlahové produkty

  2. Nahrajte soubor aplikace Excel do účtu cloudového úložiště, jako je třeba OneDrive, Dropbox nebo Disk Google.Upload the Excel file to a cloud-storage account such as OneDrive, Dropbox, or Google Drive.
  3. V PowerApps Studiu klikněte nebo klepněte v nabídce Soubor na Nový.In PowerApps Studio, click or tap New on the File menu.
  4. Na dlaždici Prázdná aplikace klikněte nebo klepněte na Rozložení pro telefon.On the Blank app tile, click or tap Phone layout.

    Možnost Nová v nabídce Soubor

  5. Přidejte připojení k tabulce FlooringEstimates v souboru aplikace Excel.Add a connection to the FlooringEstimates table in the Excel file.

    Další informace najdete v tématu Přidání připojení.For more information, see Add a connection.

  1. Na kartě Vložení klikněte nebo klepněte na Galerie a pak klikněte nebo klepněte na Proměnlivá výška.On the Insert tab, click or tap Gallery, and then click or tap Flexible height.

    Přidání galerie

  2. Změňte velikost galerie tak, aby zabírala celou obrazovku.Resize the gallery to take up the entire screen.
  3. Nastavte vlastnost Items galerie na FlooringEstimates.Set the gallery's Items property to FlooringEstimates.

Zobrazení názvů produktůShow the product names

  1. V levém horním rohu galerie klikněte nebo klepněte na ikonu tužky a vyberte šablonu galerie.In the upper-left corner of the gallery, click or tap the pencil icon to select the gallery template.

    Ikona tužky

  2. Když máte zvolenou šablonu galerie, přidejte do ní ovládací prvek Popisek.With the gallery template selected, add a Label control to it.
  3. Nastavte vlastnost Text ovládacího prvku Popisek na tento výraz:Set the Text property of the Label control to this expression:
    ThisItem.Name ThisItem.Name

    Přidání popisku

Zobrazení přehledů produktůShow the product overviews

  1. Když máte zvolenou šablonu galerie, přidejte další ovládací prvek Popisek a přesuňte ho pod první ovládací prvek Popisek.With the gallery template selected, add another Label control, and move it below the first Label control.
  2. Nastavte vlastnost Text druhého ovládacího prvku Popisek na tento výraz:Set the Text property of the second Label control to this expression:
    ThisItem.OverviewThisItem.Overview
  3. Když máte zvolený druhý ovládací prvek Popisek, klikněte nebo klepněte na ikonu názvu-značky na kartě Obsah a přejmenujte ovládací prvek na OverviewText.With the second Label control selected, click or tap the name-tag icon on the Content tab, and rename the control to OverviewText.

    Přejmenování popisku

  4. Nastavte vlastnost AutoHeight pole OverviewText na true.Set the AutoHeight property of the OverviewText box to true.

    Tento krok zajistí, že se pole bude zvětšovat nebo zmenšovat podle svého obsahu.This step ensures that the box will grow or shrink to fit its contents.

    Automatická výška textu

Zobrazení obrázků produktůShow the product images

  1. Změňte velikost šablony tak, aby její výška byla dvojnásobkem původní výšky.Resize the template so that it's twice as tall as it was.

    Ovládací prvky můžete do šablony snadněji přidávat při vytváření aplikace a tato změna nebude mít vliv na to, jak bude aplikace vypadat při běhu.You can add controls to the template more easily as you build the app, and this change won't affect how the app looks when it runs.

  2. Když máte zvolenou šablonu galerie, přidejte ovládací prvek Obrázek a přesuňte ho pod pole OverviewText.With the gallery template selected, add an Image control, and move it below the OverviewText box.
  3. Ujistěte se, že je vlastnost Image ovládacího prvku Obrázek nastavená na tento výraz:Ensure that the Image property of the Image control is set to this expression:
    ThisItem.ImageThisItem.Image
  4. Nastavte vlastnost Y ovládacího prvku Obrázek na základě umístění a velikosti pole OverviewText, jako v tomto výrazu:Set the Y property of the Image control based on the position and the size of the OverviewText box, as in this expression:
    OverviewText.Y + OverviewText.Height + 5OverviewText.Y + OverviewText.Height + 5

    Konečná aplikace

Stejný koncept použijte, pokud chcete přidat další ovládací prvky: vlastnost Y každého ovládacího prvku nastavte na základě vlastností Y a Height ovládacího prvku nad ním.Apply the same concept if you want to add more controls: set each control's Y property based on the Y and Height properties of the control above it.

Další krokyNext steps

Přečtěte si další informace o tom, jak pracovat s ovládacím prvkem galerie a vzorci.Learn more about how to work with a gallery control and formulas.