Sdílet prostřednictvím


Názorný postup: Navrhování obrazovky

Tento návod ukazuje, jak lze pomocí návrháře obrazovky LightSwitch vytvořit obrazovku, na které se zobrazí data zákazníků z ukázkové databáze Northwind.Návrhář obrazovky je plátno pro vizuální návrh, které můžete použít k úpravě vzhledu obrazovky.

Tento návod ukazuje, jak lze provádět následující úlohy:

  • Vytvoření obrazovky

  • Změna rozložení obrazovky

  • Odebrání polí z obrazovky

  • Změna pořadí položek

  • Změna zobrazovaného názvu položky

  • Změna typu ovládacího prvku položky

  • Přizpůsobení obrazovky při běhu aplikace

Požadavky

V tomto návodu se předpokládá, že je v počítači nainstalována ukázková databáze Northwind a že jste ji přidali jako zdroj dat projektu.

Vytvoření obrazovky

Tato část popisuje, jak vytvořit obrazovku pro zobrazení údajů o zákaznících z ukázkové databáze Northwind.Tato obrazovka je rozdělena do dvou částí.V první části se zobrazí souhrnný seznam všech zákazníků a ve druhé části se zobrazí podrobnosti o zákazníkovi, který je vybrán..

Vytvoření obrazovky

  1. V Průzkumníku řešení vyberte možnost Obrazovky.

  2. V nabídce Projekt klikněte na tlačítko Přidat obrazovku.

    Zobrazí se dialogové okno Přidat novou obrazovku.

  3. V dialogovém okně Přidat novou obrazovku v části Vyberte šablonu obrazovky vyberte možnost Obrazovka Seznam a podrobnosti.

  4. V části Název obrazovky zadejte Zákazníci.

  5. V rozevíracím seznamu v části Data obrazovky vyberte možnost <NázevZdrojeDat>.Zákazníci.

  6. v části Další data k zahrnutí vyberte možnost Podrobnosti o zákazníkovi a Objednávky zákazníků.

    Přidá pole entity Zákazník do části obrazovky s podrobnostmi společně se seznamem objednávek, které zákazník zadal.

    Následující obrázek znázorňuje, jak se dialogové okno zobrazí po provedení kroků v této části.

    Přidat nové dialogové okno Obrazovka

  7. Kliknutím na tlačítko OK vytvořte obrazovku.

    Zobrazí se Návrhář obrazovky.

Změna rozložení obrazovky

Obrazovka Seznam a podrobnosti obsahuje dva sloupce.V levém sloupci se zobrazuje seznam zákazníků.Pravý sloupec obsahuje dva řádky.Horní řádek obsahuje podrobnosti vybraného zákazníka a dolní řádek obsahuje objednávky, které se vztahují k vybranému zákazníkovi.Strom obsahu obrazovky návrháře obrazovky ukazuje, z čeho se tento seznam skládá.

Tento oddíl obsahuje pokyny k úpravě rozložení obrazovky tak, aby obrazovka obsahovala dva řádky namísto dvou sloupců.Horní řádek bude obsahovat seznam zákazníků.Dolní řádek bude obsahovat dva sloupce.Levý sloupec bude obsahovat podrobnosti vybraného zákazníka a v pravý sloupec bude obsahovat objednávky, které se vztahují k vybranému zákazníkovi.

Změna rozložení seznamu

  1. Ve Stromu obsahu obrazovkyNávrháře obrazovky změňte rozložení uzlu Zákazníci z hodnoty Rozložení sloupců na Rozložení řádků.Toho lze dosáhnout kliknutím na šipku dolů zobrazenou vedle uzlu Zákazníci.V rozevíracím seznamu pak klikněte na možnost Rozložení řádků.

  2. Změňte rozložení Sloupce podrobností z Rozložení řádků na Rozložení sloupců.Toho lze dosáhnout kliknutím na šipku dolů zobrazenou vedle uzlu Podrobnosti o zákaznících a následně kliknutím na položku Rozložení sloupců.

Odebrání polí z obrazovky

Ve výchozím nastavení se v oblasti obrazovky, ve které se zobrazují podrobnosti o zákazníkovi s názvem Sloupec podrobností, zobrazují všechna pole ze zdroje dat.Pokud nechcete, aby se zobrazila všechna pole, můžete ta, které nechcete, odebrat.Například následující kroky ukazují, jak lze odebrat pole Země.

Odebrání polí z obrazovky

  1. Ve Stromu obsahu obrazovky rozbalte uzel Podrobnosti o zákazníkovi (pokud ještě není rozbalen).

  2. Klikněte na pole Země a potom na příkazovém řádku Návrháře obrazovky klikněte na tlačítko Odstranit.

Změna pořadí polí

Následující kroky ukazují, jak lze změnit pořadí zobrazení polí, například pole CustomerID a pole Postal Code.

Změna pořadí polí

  1. Ve Stromu obsahu obrazovky rozbalte uzel Podrobnosti o zákazníkovi (pokud ještě není rozbalen).

  2. Chcete-li přesunout pole ID zákazníka do dolní části sloupce podrobností, přetáhněte ho pod pole Fax.

  3. Chcete-li přesunout pole PSČ na pozici těsně nad pole ID zákazníka, přetáhněte jej mezi pole Fax pole a pole ID zákazníka.

Změna typu ovládacího prvku pole

Můžete upravit způsob zobrazování pole uživateli.Například můžete nastavit textové pole tak, aby se zobrazovalo buď jako TextBox, nebo jako Label.Následující kroky ukazují, jak změnit zobrazované pole na pole Label, aby uživatel nemohl změnit jeho hodnotu.

Změna typu ovládacího prvku pole

  1. Ve Stromu obsahu obrazovky rozbalte uzel Podrobnosti o zákazníkovi (pokud ještě není rozbalen).

  2. Vyberte pole ID zákazníka pole a potom v rozevíracím seznamu vyberte možnost Popisek.

    Opakováním tohoto kroku můžete změnit další pole.

  3. Chcete-li otestovat změny, spusťte aplikaci stisknutím klávesy F5.

Přizpůsobení obrazovky v běžící aplikaci

Můžete také přizpůsobit obrazovku během spuštění aplikace.Můžete například odebrat pole, změnit pořadí polí a změnit vlastnosti, jako je například typ ovládacího prvku nebo zarovnání popisků.

Přizpůsobení obrazovky při běhu aplikace

  1. Pokud není aplikace spuštěna, spusťte ji stisknutím klávesy F5.

  2. Na panelu příkazů obrazovky klikněte na možnost Obrazovka Návrh.

  3. Na obrazovce Režim přizpůsobení odeberte pole ID zákazníka ze sloupce podrobností, a to tak, že ho vyberete v uzlu Podrobnosti o zákazníkovi a kliknete na tlačítko Odstranit (Odstraní vybranou položku.).

  4. Přesuňte pole Fax pod pole PSČ, a tom, že ho vyberete v uzlu Podrobnosti o zákazníkovi uzlu a potom kliknete na tlačítko Přesunout dolů (Nižší přesune položku na pozici v seznamu.).

  5. Změňte název pole Telefon na Telefonní číslo, a to tak, že ho vyberete v uzlu Podrobnosti o zákazníkovi a potom v okně Vlastnosti změníte hodnotu vlastnosti Zobrazovaný název na Telefonní číslo.

  6. Změňte typ zobrazení pole Telefonní číslo na Label výběrem pole v uzlu Podrobnosti o zákazníkovi a následně v okně Vlastnosti kliknutím na vlastnost Typ ovládacího prvku a výběrem hodnoty Popisek.

  7. Změňte zarovnání popisků ve sloupci podrobnostíVyberte první pole v uzlu Podrobnosti o zákazníkovi v tomto případě je to pole Název společnosti.V okně Vlastnosti klikněte na vlastnost Umístění popisků a vyberte hodnotu Zarovnáno doprava.Tento krok opakujte u všech polí v uzlu Podrobnosti o zákazníkovi.

  8. Chcete-li uložit změny, klikněte na tlačítko Uložit.Vaše aplikace nyní zobrazí změny, které jste právě provedli.

Další kroky

Ve výchozím nastavení dojde k tomu, že když vyberete zdroj dat pro obrazovku, všechna data ve zdroji se zobrazí.Pokud chcete zobrazit pouze podmnožinu dat, můžete vytvořit dotaz pro definování dat, která mají být zobrazena.Další informace naleznete v tématu Jak: návrhu dotazu pomocí Návrháře dotazu.

Viz také

Další zdroje

Obrazovky: Uživatelské rozhraní aplikace