Megosztás a következőn keresztül:


Szövegdoboz

A Szövegdoboz vezérlőelem lehetővé teszi, hogy a felhasználó szöveget írjon be egy alkalmazásba. Általában egy sornyi szöveg rögzítésére használják, de több sornyi szöveg rögzítésére is konfigurálható. A szöveg egyszerű, egységes, egyszerű szöveges formátumban jelenik meg a képernyőn.

Szövegdoboz

A TextBox számos olyan funkcióval rendelkezik, amelyek egyszerűsíthetik a szövegbevitelt. Egy ismerős, beépített helyi menüvel rendelkezik, amely támogatja a szöveg másolását és beillesztését. Az "összes törlése" gomb lehetővé teszi, hogy a felhasználó gyorsan törölje az összes beírt szöveget. Emellett beépített és alapértelmezés szerint engedélyezett helyesírás-ellenőrzési képességekkel is rendelkezik.

Ez a megfelelő vezérlő?

Szövegdoboz-vezérlővel a felhasználó beírhat és szerkeszthet formázatlan szöveget, például űrlapon. A TextBox szövegének beolvasásához és beállításához használhatja a szöveg tulajdonságot.

A TextBox írásvédetté alakítható, de ennek ideiglenes, feltételes állapotnak kell lennie. Ha a szöveg nem szerkeszthető, fontolja meg inkább a TextBlock használatát.

Jelszó vagy egyéb személyes adatok( például társadalombiztosítási szám) gyűjtéséhez használjon PasswordBox-vezérlőt . A jelszómező úgy néz ki, mint egy szövegbeviteli mező, azzal a kivétellel, hogy a beírt szöveg helyett listajeleket jelenít meg.

Az AutoSuggestBox vezérlővel lehetővé teszi, hogy a felhasználó keresési kifejezéseket adjon meg, vagy megjelenítse a felhasználónak a beíráskor kiválasztandó javaslatok listáját.

Használjon RichEditBox-t a rich szöveges fájlok megjelenítéséhez és szerkesztéséhez.

A megfelelő szövegvezérlő kiválasztásáról további információt a Szövegvezérlők című cikkben talál.

Recommendations

  • Címkét vagy helyőrző szöveget használjon, ha a szövegdoboz rendeltetése nem egyértelmű. A címke látható, függetlenül attól, hogy a szövegbeviteli mezőnek van-e értéke. A helyőrző szöveg a szövegbeviteli mezőben jelenik meg, és az érték megadása után eltűnik.
  • Adjon meg egy megfelelő szélességet a szövegdoboznak a beírható értékek tartományához. Word hossza nyelvenként eltérő, ezért vegye figyelembe a honosítást, ha azt szeretné, hogy az alkalmazás világra kész legyen.
  • A szövegbeviteli mezők általában egysorosak (TextWrap = "NoWrap"). Ha a felhasználóknak hosszú sztringet kell beírniuk vagy szerkesztenie, állítsa a szövegbeviteli mezőt többsorosra (TextWrap = "Wrap").
  • A szövegbeviteli mező általában szerkeszthető szöveghez használható. A szövegbeviteli mezőket azonban írásvédetté teheti, így a tartalma olvasható, kijelölhető és másolható, de nem szerkeszthető.
  • Ha csökkentenie kell a nézetben a zsúfoltság mértékét, fontolja meg, hogy a szövegbeviteli mezők csak akkor jelenjenek meg, ha be van jelölve egy vezérlő jelölőnégyzet. A beviteli mező engedélyezett állapotát egy vezérlőelemhez, például egy jelölőnégyzethez is kötheti.
  • Fontolja meg, hogyan viselkedjen egy szövegbeviteli mező, ha az tartalmaz egy értéket, és a felhasználó rákoppint. Az alapértelmezett viselkedés alkalmasabb az érték szerkesztésére, mint annak lecserélésére; a beszúrási pont a szavak közé kerül, és semmi sincs kijelölve. Ha a csere az adott szövegbeviteli mező leggyakoribb használati esete, akkor a mező összes szövegét kijelölheti, amikor a vezérlőelem fókuszba kerül, és a gépelés lecseréli a kijelölést.

Egysoros beviteli mezők

  • Több egysoros szövegdoboz használatával sok kis szöveges információt rögzíthet. Ha a szövegdobozok a természetben kapcsolódnak egymáshoz, csoportosítsa őket.

  • Az egysoros szövegdobozok méretét kissé szélesebbre kell tenni, mint a leghosszabban várt bemenet. Ha ettől a vezérlő túl széles lesz, különítse el két külön vezérlőre. Egyetlen címbemenetet például feloszthat az "1. címsor" és a "2. címsor" értékre.

  • Adja meg a beírható karakterek maximális hosszát. Ha a háttéradatforrás nem engedélyezi a hosszú bemeneti sztringet, korlátozza a bemenetet, és egy érvényesítési előugró ablak használatával tájékoztassa a felhasználókat, hogy mikor érik el a korlátot.

  • Az egysoros szövegbeviteli vezérlőkkel kis szövegrészeket gyűjthet össze a felhasználóktól.

    Az alábbi példa egy egysoros szövegdobozt mutat be egy biztonsági kérdésre adott válasz rögzítéséhez. A válasz várhatóan rövid lesz, ezért itt egy egysoros szövegdobozra van szükség.

    Alapszintű adatbevitel

  • A rövid, rögzített méretű, egysoros szövegbeviteli vezérlők segítségével adott formátumú adatokat adhat meg.

    Formázott adatbevitel

  • Sztringek beviteléhez vagy szerkesztéséhez használjon egy egysoros, nem korlátozott szövegbeviteli vezérlőt, valamint egy parancsgombot, amely segít a felhasználóknak érvényes értékek kiválasztásában.

    Támogatott adatbevitel

Többsoros szövegbeviteli vezérlők

  • Amikor gazdag szövegdobozt hoz létre, adjon meg stílusgombokat, és valósítsa meg azok műveleteit.

  • Az alkalmazás stílusának megfelelő betűtípust használjon.

  • Állítsa a szövegvezérlő magasságát olyan magasra, hogy megfeleljen a tipikus bejegyzéseknek.

  • Ha hosszú hosszúságú szöveget rögzít egy maximális karakterrel vagy szószámmal, használjon egyszerű szövegdobozt, és adjon meg egy élő számlálót, amely megmutatja a felhasználónak, hogy hány karakter vagy szó maradt a korlát elérése előtt. A számlálót saját maga kell létrehoznia; helyezze a szövegdoboz alá, és frissítse dinamikusan, ahogy a felhasználó beírja az egyes karaktereket vagy szavakat.

    Hosszú szövegrész

  • Ne engedje, hogy a szövegbeviteli vezérlők magasságban növekedjenek a felhasználók gépelése közben.

  • Ne használjon többsoros szövegdobozt, ha a felhasználóknak csak egyetlen sorra van szükségük.

  • Ne használjon rich text vezérlőelemet, ha egy egyszerű szövegvezérlő megfelelő.

Szövegdoboz létrehozása

WinUI 3 Katalógus ikon A WinUI 3 Katalógus alkalmazás interaktív példákat tartalmaz a WinUI vezérlőire és funkcióira. Kérje le az alkalmazást a Microsoft Áruházból vagy keresse meg a forráskódot a GitHub webhelyen.

Az alábbi XAML egy fejlécet és helyőrző szöveget tartalmazó egyszerű szövegdobozhoz.

<TextBox Width="500" Header="Notes" PlaceholderText="Type your notes here"/>
TextBox textBox = new TextBox();
textBox.Width = 300;
textBox.Header = "Notes";
textBox.PlaceholderText = "Type your notes here";
// Add the TextBox to the visual tree.
rootGrid.Children.Add(textBox);

Ez az XAML-ből származó szövegmező.

Egyszerű szövegdoboz

Szövegmező használata űrlapon történő adatbevitelhez

Az űrlapon gyakran egy szövegdobozzal fogadják az adatbevitelt, és a Szöveg tulajdonság segítségével kérhetjük le a teljes szöveg szringet a szövegdobozból. A Szöveg tulajdonság eléréséhez általában egy beküldés gombra kattintásához hasonló eseményt használ, de kezelheti a TextChanged vagy TextChanging eseményt is, ha valamit tennie kell, amikor a szöveg változik.

Ez a példa bemutatja, hogyan szerezheti be és állíthatja be a szövegdoboz aktuális tartalmát.

<TextBox name="SampleTextBox" Text="Sample Text"/>
string sampleText = SampleTextBox.Text;
...
SampleTextBox.Text = "Sample text retrieved";

Kiegészíthet egy Fejlécet (vagy címkét) és PlaceholderText-et (vagy vízjelet) a szövegdobozhoz, hogy a felhasználónak megmutassa, mire szolgál a szövegdoboz. A fejléc megjelenésének testreszabásához a Fejléc helyett a HeaderTemplate tulajdonságot állíthatja be. A tervezési információkért tekintse meg a címkékre vonatkozó irányelvek című témakört.

A MaxLength tulajdonság beállításával korlátozhatja a felhasználó által beírható karakterek számát. A MaxLength azonban nem korlátozza a beillesztett szöveg hosszát. A Beillesztés esemény használatával módosíthatja a beillesztett szöveget, ha ez fontos az alkalmazás számára.

A szövegmező tartalmaz egy mindent törlő gombot ("X"), amely akkor jelenik meg, amikor szöveget írnak a mezőbe. Amikor egy felhasználó az "X" gombra kattint, a szövegmezőben lévő szöveg törlődik. Így néz ki.

Az összes törlése gombot tartalmazó szövegdoboz

Az Összes törlése gomb csak szerkeszthető, egysoros szövegdobozok esetén jelenik meg, amelyek szövegeket tartalmaznak, és fókuszban vannak.

Az összes törlése gomb az alábbi esetekben nem jelenik meg:

  • IsReadOnly értéke igaz
  • AcceptsReturn igaz
  • TextWrap egy másik értékkel bír, mint NoWrap.

Ez a példa bemutatja, hogyan szerezheti be és állíthatja be a szövegdoboz aktuális tartalmát.

<TextBox name="SampleTextBox" Text="Sample Text"/>
string sampleText = SampleTextBox.Text;
...
SampleTextBox.Text = "Sample text retrieved";

Szövegdoboz írásvédetté tétele

A szövegdobozokat írásvédetté teheti, ha az IsReadOnly tulajdonságot igazraállítja. Ezt a tulajdonságot általában az alkalmazáskódban váltja ki az alkalmazás feltételei alapján. Ha mindig csak olvasható szövegre van szüksége, fontolja meg inkább a TextBlock használatát.

A TextBox írásvédetté alakítható az IsReadOnly tulajdonság igaz értékre állításával. Előfordulhat például, hogy van egy szövegdoboza, ahol a felhasználó csak bizonyos feltételek mellett tud megjegyzéseket írni. A TextBox írásvédetté alakítható, amíg a feltételek teljesülnek. Ha csak szöveget szeretne megjeleníteni, fontolja meg inkább a TextBlock vagy a RichTextBlock használatát.

A csak olvasható szövegdobozok ugyanúgy néznek ki, mint az olvasási/írási szövegdobozok, ezért zavaró lehet a felhasználó számára. A felhasználó kijelölhet és másolhat szöveget. Be van kapcsolva

Többsoros bemenet engedélyezése

Két tulajdonsággal szabályozhatja, hogy a szövegdoboz több sorban is megjelenít-e szöveget. Általában mindkét tulajdonságot többsoros szövegmezővé állítja be.

  • Ha azt szeretné, hogy a szövegmező engedélyezze és megjelenítse a soremelés vagy visszatérő karaktereket, állítsa az AcceptsReturn tulajdonságot igazra.
  • A szövegburkolás engedélyezéséhez állítsa a TextWrapping tulajdonságotBurkolás értékre. Ez ahhoz vezet, hogy a szöveg sortörést hajt végre, amikor eléri a szövegdoboz szélét, a sorelválasztó karakterektől függetlenül.

Megjegyzés:

A TextBox és a RichEditBox nem támogatja a WrapWholeWords értéket a TextWrapping tulajdonságaikhoz. Ha a WrapWholeWords függvényt a TextBox.TextWrapping vagy a RichEditBox.TextWrapping értékként próbálja használni, a rendszer érvénytelen argumentumkivételt alkalmaz.

A többsoros szövegdobozok továbbra is függőlegesen növekednek a szöveg beírásakor, kivéve, ha azt a Magasság vagy MaxHeight tulajdonság vagy egy szülőtároló korlátozza. Tesztelje, hogy a többsoros szövegdobozok nem nőnek-e túl a látható területen, és ha igen, korlátozza a növekedését. Azt javasoljuk, hogy mindig adjon meg egy megfelelő magasságot egy többsoros szövegdobozhoz, és ne engedje, hogy a felhasználó típusának megfelelően nőjön a magasság.

Ha szükséges, a görgetés görgetőkerékkel vagy érintéssel automatikusan engedélyezve van. A függőleges görgetősávok azonban alapértelmezés szerint nem láthatók. A függőleges görgetősávokat úgy jelenítheti meg, hogy a ScrollViewer.VerticalScrollBarVisibility értékét Auto-ra állítja a beágyazott ScrollViewerben, ahogy az itt látható.

<TextBox AcceptsReturn="True" TextWrapping="Wrap"
         MaxHeight="172" Width="300" Header="Description"
         ScrollViewer.VerticalScrollBarVisibility="Auto"/>
TextBox textBox = new TextBox();
textBox.AcceptsReturn = true;
textBox.TextWrapping = TextWrapping.Wrap;
textBox.MaxHeight = 172;
textBox.Width = 300;
textBox.Header = "Description";
ScrollViewer.SetVerticalScrollBarVisibility(textBox, ScrollBarVisibility.Auto);

Így néz ki a szövegdoboz a szöveg hozzáadása után.

Többsoros szövegmező

A szöveg megjelenítésének formázása

A TextAlignment tulajdonság használatával igazíthat szöveget egy szövegdobozon belül. Ha a szövegdobozt a lap elrendezésén belül szeretné igazítani, használja a HorizontalAlignment és a VerticalAlignment tulajdonságokat.

Bár a szövegdoboz csak a formázatlan szövegeket támogatja, testre szabhatja, hogy a szöveg hogyan jelenjen meg a szövegdobozban a védjegyezésnek megfelelően. A szöveg megjelenésének módosításához beállíthatja az olyan szabványos vezérlőtulajdonságokat, mint a FontFamily, a FontSize, a FontStyle, a Background, az Előtér és a CharacterSpacing. Ezek a tulajdonságok csak azt befolyásolják, hogy a szövegdoboz hogyan jeleníti meg a szöveget helyileg, ezért ha a szöveget egy rich text vezérlőelembe szeretné másolni és beilleszteni, például nem alkalmazott formázást.

Ez a példa egy írásvédett szövegdobozt mutat be, amely több tulajdonsággal rendelkezik a szöveg megjelenésének testreszabásához.

<TextBox Text="Sample Text" IsReadOnly="True"
         FontFamily="Verdana" FontSize="24"
         FontWeight="Bold" FontStyle="Italic"
         CharacterSpacing="200" Width="300"
         Foreground="Blue" Background="Beige"/>
TextBox textBox = new TextBox();
textBox.Text = "Sample Text";
textBox.IsReadOnly = true;
textBox.FontFamily = new FontFamily("Verdana");
textBox.FontSize = 24;
textBox.FontWeight = Windows.UI.Text.FontWeights.Bold;
textBox.FontStyle = Windows.UI.Text.FontStyle.Italic;
textBox.CharacterSpacing = 200;
textBox.Width = 300;
textBox.Background = new SolidColorBrush(Windows.UI.Colors.Beige);
textBox.Foreground = new SolidColorBrush(Windows.UI.Colors.Blue);
// Add the TextBox to the visual tree.
rootGrid.Children.Add(textBox);

Az eredményként kapott szövegdoboz így néz ki.

Formázott szövegdoboz

A helyi menü módosítása

A szövegdoboz helyi menüjében megjelenő parancsok alapértelmezés szerint a szövegdoboz állapotától függnek. Például a következő parancsok jeleníthetők meg, ha a szövegdoboz szerkeszthető.

Command Akkor jelenik meg, ha...
Másolás szöveg van kijelölve.
Vág szöveg van kijelölve.
Beillesztés a vágólap szöveget tartalmaz.
Az összes kijelölése a Szövegdoboz szöveget tartalmaz.
Visszavonás szöveg módosult.

A helyi menüben megjelenő parancsok módosításához kezelje a ContextMenuOpening eseményt . Erre példa a RichEditBox CommandBarFlyout testreszabása – "Megosztás" példa hozzáadása a WinUI 3 katalógusban. A tervezési információkért tekintse meg a helyi menükútmutatóját.

Kijelölés, másolás és beillesztés

A Kijelölt szöveg tulajdonság használatával bekérheti vagy beállíthatja a kijelölt szöveget egy szövegdobozban. A kijelölés módosításához használja a SelectionStart és a SelectionLength tulajdonságokat, valamint a Select és SelectAll metódusokat. Kezelje a SelectionChanged eseményt, hogy csináljon valamit, amikor a felhasználó szöveget jelöl ki vagy megszünteti a kijelölést. A Kijelölt szöveg kiemeléséhez használt színt a SelectionHighlightColor tulajdonság beállításával módosíthatja.

A TextBox alapértelmezés szerint támogatja a másolást és beillesztést. Az alkalmazás szerkeszthető szövegvezérlőire egyénileg kezelheti a Beillesztés eseményt. Például eltávolíthatja a sortöréseket egy többsoros címből, amikor beilleszti egy egysoros keresőmezőbe. Vagy ellenőrizheti a beillesztett szöveg hosszát, és figyelmeztetheti a felhasználót, ha az meghaladja az adatbázisba menthető maximális hosszt. További információkért és példákért lásd a Beillesztés eseményt.

Az alábbiakban bemutatunk egy példát ezekre a tulajdonságokra és a használt módszerekre. Amikor kijelöl egy szöveget az első szövegmezőben, a kijelölt szöveg megjelenik a második szövegmezőben, amely írásvédett. A SelectionLength és a SelectionStart tulajdonságok értékei két szövegblokkban jelennek meg. Ez a SelectionChanged esemény használatával történik.

<StackPanel>
   <TextBox x:Name="textBox1" Height="75" Width="300" Margin="10"
         Text="The text that is selected in this TextBox will show up in the read only TextBox below."
         TextWrapping="Wrap" AcceptsReturn="True"
         SelectionChanged="TextBox1_SelectionChanged" />
   <TextBox x:Name="textBox2" Height="75" Width="300" Margin="5"
         TextWrapping="Wrap" AcceptsReturn="True" IsReadOnly="True"/>
   <TextBlock x:Name="label1" HorizontalAlignment="Center"/>
   <TextBlock x:Name="label2" HorizontalAlignment="Center"/>
</StackPanel>
private void TextBox1_SelectionChanged(object sender, RoutedEventArgs e)
{
    textBox2.Text = textBox1.SelectedText;
    label1.Text = "Selection length is " + textBox1.SelectionLength.ToString();
    label2.Text = "Selection starts at " + textBox1.SelectionStart.ToString();
}

Íme a kód eredménye.

Kijelölt szöveg szövegdobozban

A szövegvezérlő megfelelő billentyűzetének kiválasztása

Ha azt szeretné, hogy a felhasználók az érintőbillentyűzet vagy a Soft Input Panel (SIP) használatával adjanak meg adatokat, beállíthatja a szövegvezérlő bemeneti hatókörét úgy, hogy az megfeleljen a felhasználó által várt adattípusnak.

Az érintőbillentyűzet akkor használható szövegbevitelhez, ha az alkalmazás érintőképernyős eszközön fut. Az érintéses billentyűzetet akkor hívja meg a rendszer, ha a felhasználó egy szerkeszthető beviteli mezőre, például egy Szövegdobozra vagy RichEditBoxra koppint. A felhasználók sokkal gyorsabban és egyszerűbben adhatnak meg adatokat az alkalmazásban, ha a szövegvezérlő bemeneti hatókörét úgy állítja be, hogy az megfeleljen a felhasználó által várt adattípusnak. A bemeneti hatókör egy tippet ad a rendszernek a vezérlő által várt szövegbevitel típusáról, hogy a rendszer speciális érintőbillentyűzet-elrendezést biztosítson a bemeneti típushoz.

Ha például egy szövegdobozt csak négyjegyű PIN-kód megadására használ, állítsa az InputScope tulajdonságot Szám értékre. Ez arra utasítja a rendszert, hogy jelenítse meg a számbillentyűzet elrendezését, ami megkönnyíti a felhasználó számára a PIN-kód megadását.

Fontos A bemeneti hatókör nem okoz bemeneti ellenőrzést, és nem akadályozza meg a felhasználót abban, hogy bármilyen bemenetet adjon meg hardveres billentyűzeten vagy más beviteli eszközön keresztül. Továbbra is Ön a felelős a kód bemenetének szükség szerinti érvényesítéséért.

Az érintőbillentyűzetet befolyásoló egyéb tulajdonságok a következők: IsSpellCheckEnabled, IsTextPredictionEnabledés PreventKeyboardDisplayOnProgrammaticFocus. (Az IsSpellCheckEnabled hardveres billentyűzet használata esetén a Szövegdobozra is hatással van.)

További információkért és példákért lásd: Beviteli hatókör használata az érintőbillentyűzet és a tulajdonság dokumentációjának módosításához.