Xamarin.Forms Editor
Das Editor
Steuerelement wird verwendet, um mehrzeilige Eingaben zu akzeptieren.
Festlegen und Lesen von Text
Die Editor
Eigenschaft wird wie andere Textpräsentationsansichten verfügbar Text
gemacht. Diese Eigenschaft kann verwendet werden, um den von der Editor
Zeichenfolge dargestellten Text festzulegen und zu lesen. Das folgende Beispiel veranschaulicht das Festlegen der Text
Eigenschaft in XAML:
<Editor x:Name="editor" Text="I am an Editor" />
In C#:
var editor = new Editor { Text = "I am an Editor" };
Um Text zu lesen, greifen Sie auf die Text
Eigenschaft in C# zu:
var text = editor.Text;
Festlegen von Platzhaltertext
Dies Editor
kann so festgelegt werden, dass Platzhaltertext angezeigt wird, wenn keine Benutzereingaben gespeichert werden. Dies wird durch Festlegen der Placeholder
Eigenschaft auf ein string
, und wird häufig verwendet, um den Typ des Inhalts anzugeben, der für die Editor
Eigenschaft geeignet ist. Darüber hinaus kann die Platzhaltertextfarbe durch Festlegen der PlaceholderColor
Eigenschaft auf eine Color
:
<Editor Placeholder="Enter text here" PlaceholderColor="Olive" />
var editor = new Editor { Placeholder = "Enter text here", PlaceholderColor = Color.Olive };
Verhindern der Texteingabe
Benutzer können daran gehindert werden, den Text in einer Editor
Datei zu ändern, indem Sie die IsReadOnly
Eigenschaft festlegen, die einen Standardwert von , auf false
true
:
<Editor Text="This is a read-only Editor"
IsReadOnly="true" />
var editor = new Editor { Text = "This is a read-only Editor", IsReadOnly = true });
Hinweis
Die IsReadonly
Eigenschaft ändert nicht das visuelle Erscheinungsbild einer Editor
Eigenschaft, im Gegensatz zu der IsEnabled
Eigenschaft, die auch die visuelle Darstellung des Editor
in Grau ändert.
Transformieren von Text
Eine Editor
kann die Groß-/Kleinschreibung des Texts transformieren, der in der Text
Eigenschaft gespeichert ist, indem die TextTransform
Eigenschaft auf einen Wert der TextTransform
Enumeration festgelegt wird. Diese Enumeration weist vier Werte auf:
None
gibt an, dass der Text nicht transformiert wird.Default
gibt an, dass das Standardverhalten für die Plattform verwendet wird. Dies ist der Standardwert derTextTransform
-Eigenschaft.Lowercase
gibt an, dass der Text in Kleinbuchstaben umgewandelt wird.Uppercase
gibt an, dass der Text in Großbuchstaben umgewandelt wird.
Das folgende Beispiel zeigt das Transformieren von Text in Großbuchstaben:
<Editor Text="This text will be displayed in uppercase."
TextTransform="Uppercase" />
Der entsprechende C#-Code lautet:
Editor editor = new Editor
{
Text = "This text will be displayed in uppercase.",
TextTransform = TextTransform.Uppercase
};
Eingabelänge einschränken
Die MaxLength
Eigenschaft kann verwendet werden, um die für die Editor
Eingabe zulässige Eingabelänge einzuschränken. Diese Eigenschaft sollte auf eine positive ganze Zahl festgelegt werden:
<Editor ... MaxLength="10" />
var editor = new Editor { ... MaxLength = 10 };
Ein MaxLength
Eigenschaftswert von 0 gibt an, dass keine Eingabe zulässig ist, und ein Wert von int.MaxValue
, der der Standardwert für ein Editor
Objekt ist, gibt an, dass es keine effektive Beschränkung für die Anzahl von Zeichen gibt, die eingegeben werden können.
Zeichenabstand
Der Zeichenabstand kann auf ein Editor
Zeichen angewendet werden, indem die Editor.CharacterSpacing
Eigenschaft auf einen double
Wert festgelegt wird:
<Editor ...
CharacterSpacing="10" />
Der entsprechende C#-Code lautet:
Editor editor = new editor { CharacterSpacing = 10 };
Das Ergebnis ist, dass Zeichen im Text, der durch den Editor
Abstand von gerätenunabhängigen CharacterSpacing
Einheiten angezeigt wird, voneinander getrennt sind.
Hinweis
Der CharacterSpacing
Eigenschaftswert wird auf den Text angewendet, der von den Text
Eigenschaften Placeholder
angezeigt wird.
Automatische Größe eines Editors
Eine Editor
Eigenschaft kann für die automatische Größe des Inhalts erstellt werden, indem sie die Editor.AutoSize
Eigenschaft auf TextChanges
festlegen, bei der es sich um einen Wert der EditorAutoSizeOption
Enumeration handelt. Diese Aufzählung weist zwei Werte auf:
Disabled
gibt an, dass die automatische Größenänderung deaktiviert ist und der Standardwert ist.TextChanges
gibt an, dass die automatische Größenänderung aktiviert ist.
Dies kann im Code wie folgt erfolgen:
<Editor Text="Enter text here" AutoSize="TextChanges" />
var editor = new Editor { Text = "Enter text here", AutoSize = EditorAutoSizeOption.TextChanges };
Wenn die automatische Größenänderung aktiviert ist, wird die Höhe der Editor
Größe erhöht, wenn der Benutzer sie mit Text ausfüllt, und die Höhe wird verringert, wenn der Benutzer Text löscht.
Hinweis
Eine Editor
automatische Größe wird nicht automatisch festgelegt, wenn die HeightRequest
Eigenschaft festgelegt wurde.
Anpassen der Tastatur
Die Tastatur, die angezeigt wird, wenn Benutzer mit einer Editor
App interagieren, kann programmgesteuert über die Keyboard
Eigenschaft auf eine der folgenden Eigenschaften der Keyboard
Klasse festgelegt werden:
Chat
: Wird zum Schreiben von Texten verwendet und in Situationen, in denen Emojis nützlich sind.Default
: die Standardtastatur.Email
: Wird beim Eingeben von E-Mail-Adressen verwendet.Numeric
: Wird beim Eingeben von Zahlen verwendet.Plain
: Wird beim Eingeben von Text verwendet, ohne Angabe vonKeyboardFlags
.Telephone
: Wird beim Eingeben von Telefonnummern verwendet.Text
: Wird beim Eingeben von Text verwendet.Url
: Wird beim Eingeben von Dateipfaden und Webadressen verwendet.
Dies kann in XAML folgendermaßen erfüllt werden:
<Editor Keyboard="Chat" />
Der entsprechende C#-Code lautet:
var editor = new Editor { Keyboard = Keyboard.Chat };
Beispiele für jede Tastatur finden Sie in unserem Rezept-Repository .
Die Keyboard
-Klasse verfügt auch über eine Create
-Factorymethode, die zum Anpassen einer Tastatur durch Festlegen des Verhaltens für Groß-/Kleinschreibung, Rechtschreibprüfung und Vorschläge verwendet werden kann. KeyboardFlags
-Enumerationswerte werden als Argumente der Methode festgelegt, wobei das benutzerdefinierte Keyboard
zurückgegeben wird. Die KeyboardFlags
-Enumeration verfügt über folgende Werte:
None
: Der Tastatur werden keine Features hinzugefügt.CapitalizeSentence
: Gibt an, dass der erste Buchstabe des ersten Worts jedes Satzes automatisch groß geschrieben wird.Spellcheck
: Gibt an, dass die Rechtschreibprüfung für den eingegebenen Text durchgeführt wird.Suggestions
: Gibt an, dass Wortvervollständigungen für den eingegebenen Text angeboten werden.CapitalizeWord
: Gibt an, dass der erste Buchstabe von jedem Wort automatisch groß geschrieben wird.CapitalizeCharacter
: Gibt an, dass jedes Zeichen automatisch groß geschrieben wird.CapitalizeNone
: Gibt an, dass keine automatische Großschreibung erfolgt.All
: Gibt an, dass für den eingegebenen Text die Rechtschreibprüfung, die Vervollständigung von Wörtern und die Großschreibung am Satzanfang erfolgen.
Das folgende XAML-Codebeispiel zeigt, wie Sie den Standardwert für Keyboard
anpassen können, um Wortvervollständigungen anzubieten und jedes eingegebene Zeichen groß zu schreiben:
<Editor>
<Editor.Keyboard>
<Keyboard x:FactoryMethod="Create">
<x:Arguments>
<KeyboardFlags>Suggestions,CapitalizeCharacter</KeyboardFlags>
</x:Arguments>
</Keyboard>
</Editor.Keyboard>
</Editor>
Der entsprechende C#-Code lautet:
var editor = new Editor();
editor.Keyboard = Keyboard.Create(KeyboardFlags.Suggestions | KeyboardFlags.CapitalizeCharacter);
Aktivieren und Deaktivieren der Rechtschreibprüfung
Die IsSpellCheckEnabled
Eigenschaft steuert, ob die Rechtschreibprüfung aktiviert ist. Standardmäßig ist die Eigenschaft auf true
. Wenn der Benutzer Text eingibt, werden Rechtschreibfehler angegeben.
Für einige Texteingabeszenarien, z. B. die Eingabe eines Benutzernamens, bietet die Rechtschreibprüfung jedoch eine negative Erfahrung und sollte daher durch Festlegen der IsSpellCheckEnabled
Eigenschaft auf :false
<Editor ... IsSpellCheckEnabled="false" />
var editor = new Editor { ... IsSpellCheckEnabled = false };
Hinweis
Wenn die IsSpellCheckEnabled
Eigenschaft auf false
", und eine benutzerdefinierte Tastatur nicht verwendet wird, wird die systemeigene Rechtschreibprüfung deaktiviert. Wenn jedoch eine Keyboard
Einstellung festgelegt wurde, die die Rechtschreibprüfung deaktiviert, z Keyboard.Chat
. B. wird die IsSpellCheckEnabled
Eigenschaft ignoriert. Daher kann die Eigenschaft nicht verwendet werden, um die Rechtschreibprüfung für ein Keyboard
Objekt zu aktivieren, das sie explizit deaktiviert.
Aktivieren und Deaktivieren der Textvorhersage
Die IsTextPredictionEnabled
Eigenschaft steuert, ob Textvorhersage und automatische Textkorrektur aktiviert sind. Standardmäßig ist die Eigenschaft auf true
. Während der Benutzer Text eingibt, werden Wortvorhersagen dargestellt.
Für einige Texteingabeszenarien, z. B. die Eingabe eines Benutzernamens, die Textvorhersage und die automatische Textkorrektur, wird jedoch eine negative Erfahrung erzielt und sollte durch Festlegen der IsTextPredictionEnabled
Eigenschaft auf false
:
<Editor ... IsTextPredictionEnabled="false" />
var editor = new Editor { ... IsTextPredictionEnabled = false };
Hinweis
Wenn die IsTextPredictionEnabled
Eigenschaft auf false
", und eine benutzerdefinierte Tastatur nicht verwendet wird, wird die Textvorhersage und die automatische Textkorrektur deaktiviert. Wenn jedoch eine Keyboard
Festgelegt wurde, die die Textvorhersage deaktiviert, wird die IsTextPredictionEnabled
Eigenschaft ignoriert. Daher kann die Eigenschaft nicht verwendet werden, um die Textvorhersage für ein Objekt Keyboard
zu aktivieren, das sie explizit deaktiviert.
Farben
Editor
kann für die Verwendung einer benutzerdefinierten Hintergrundfarbe über die BackgroundColor
Eigenschaft festgelegt werden. Besondere Sorgfalt ist erforderlich, um sicherzustellen, dass Farben auf jeder Plattform verwendet werden können. Da jede Plattform unterschiedliche Standardwerte für Textfarbe aufweist, müssen Sie möglicherweise eine benutzerdefinierte Hintergrundfarbe für jede Plattform festlegen. Weitere Informationen zum Optimieren der Benutzeroberfläche für jede Plattform finden Sie unter "Arbeiten mit Plattformoptimierungen ".
In C#:
public partial class EditorPage : ContentPage
{
public EditorPage ()
{
InitializeComponent ();
var layout = new StackLayout { Padding = new Thickness(5,10) };
this.Content = layout;
//dark blue on UWP & Android, light blue on iOS
var editor = new Editor { BackgroundColor = Device.RuntimePlatform == Device.iOS ? Color.FromHex("#A4EAFF") : Color.FromHex("#2c3e50") };
layout.Children.Add(editor);
}
}
In XAML:
<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="TextSample.EditorPage"
Title="Editor Demo">
<ContentPage.Content>
<StackLayout Padding="5,10">
<Editor>
<Editor.BackgroundColor>
<OnPlatform x:TypeArguments="x:Color">
<On Platform="iOS" Value="#a4eaff" />
<On Platform="Android, UWP" Value="#2c3e50" />
</OnPlatform>
</Editor.BackgroundColor>
</Editor>
</StackLayout>
</ContentPage.Content>
</ContentPage>
Stellen Sie sicher, dass die von Ihnen ausgewählten Hintergrund- und Textfarben auf jeder Plattform verwendbar sind und keinen Platzhaltertext verdeckt.
Ereignisse und Interaktivität
Editor
macht zwei Ereignisse verfügbar:
- TextChanged – wird ausgelöst, wenn sich der Text im Editor ändert. Stellt den Text vor und nach der Änderung bereit.
- Abgeschlossen – wird ausgelöst, wenn der Benutzer die Eingabe beendet hat, indem er die EINGABETASTE auf der Tastatur drückt.
Hinweis
Die VisualElement
Klasse, von der Entry
geerbt wird, hat Focused
auch Ereignisse und Unfocused
Ereignisse.
Abgeschlossen
Das Completed
Ereignis wird verwendet, um auf den Abschluss einer Interaktion mit einem Editor
. Completed
wird ausgelöst, wenn der Benutzer die Eingabe mit einem Feld beendet, indem er die Eingabetaste auf der Tastatur eingibt (oder durch Drücken der TAB-TASTE auf UWP). Der Handler für das Ereignis ist ein generischer Ereignishandler, der den Absender übernimmt und EventArgs
:
void EditorCompleted (object sender, EventArgs e)
{
var text = ((Editor)sender).Text; // sender is cast to an Editor to enable reading the `Text` property of the view.
}
Das abgeschlossene Ereignis kann in Code und XAML abonniert werden:
In C#:
public partial class EditorPage : ContentPage
{
public EditorPage ()
{
InitializeComponent ();
var layout = new StackLayout { Padding = new Thickness(5,10) };
this.Content = layout;
var editor = new Editor ();
editor.Completed += EditorCompleted;
layout.Children.Add(editor);
}
}
In XAML:
<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="TextSample.EditorPage"
Title="Editor Demo">
<ContentPage.Content>
<StackLayout Padding="5,10">
<Editor Completed="EditorCompleted" />
</StackLayout>
</ContentPage.Content>
</Contentpage>
TextChanged
Das TextChanged
Ereignis wird verwendet, um auf eine Änderung des Inhalts eines Felds zu reagieren.
TextChanged
wird immer dann ausgelöst, wenn sich die Text
Editor
Änderungen ändern. Der Handler für das Ereignis übernimmt eine Instanz von TextChangedEventArgs
. TextChangedEventArgs
bietet Zugriff auf die alten und neuen Werte der Editor
Text
über die OldTextValue
Und NewTextValue
Eigenschaften:
void EditorTextChanged (object sender, TextChangedEventArgs e)
{
var oldText = e.OldTextValue;
var newText = e.NewTextValue;
}
Das abgeschlossene Ereignis kann in Code und XAML abonniert werden:
In Code:
public partial class EditorPage : ContentPage
{
public EditorPage ()
{
InitializeComponent ();
var layout = new StackLayout { Padding = new Thickness(5,10) };
this.Content = layout;
var editor = new Editor ();
editor.TextChanged += EditorTextChanged;
layout.Children.Add(editor);
}
}
In XAML:
<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="TextSample.EditorPage"
Title="Editor Demo">
<ContentPage.Content>
<StackLayout Padding="5,10">
<Editor TextChanged="EditorTextChanged" />
</StackLayout>
</ContentPage.Content>
</ContentPage>