Wie füge ich mit MVVM rechteckige Rechtecke zu einer WPF -Leinwand hinzu?

Fügen Sie im WPF -MVVM -Modus Rechteck zu Canvas

hinzu

Problembeschreibung

Sie möchten eine Reihe von Rechtecken in Leinwand in einer MVVM -Anwendung dynamisch generieren und anzeigen. Die Anzahl der Rechtecke ist zur Laufzeit unbekannt, und Sie benötigen eine effiziente Lösung, um sie zu Canvas hinzuzufügen.

Lösung

<.> 1. Zusammenfassung Indikation:

Erstellen Sie ein ViewModel, das abstrakte Darstellungen rechteckiger Listen enthält, zum Beispiel:

<.> 2. xaml bedeutet:

<code class="language-csharp">public class RectItem
{
    public double X { get; set; }
    public double Y { get; set; }
    public double Width { get; set; }
    public double Height { get; set; }
}

public class ViewModel
{
    public ObservableCollection<RectItem> RectItems { get; set; }
}</code>

Erstellen Sie in Ihrem Mainwindow eine Leinwand als rechteckige Behälter:

<.> 3. Datenbindung:

binden Sie die

<code class="language-xml"><ItemsControl ItemsSource="{Binding RectItems}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <Canvas />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemContainerStyle>
        <Style TargetType="ContentPresenter">
            <Setter Property="Canvas.Left" Value="{Binding X}" />
            <Setter Property="Canvas.Top" Value="{Binding Y}" />
        </Style>
    </ItemsControl.ItemContainerStyle>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Rectangle Fill="Black" Height="{Binding Height}" Width="{Binding Width}" />
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl></code>

-Kollektion im ViewModel an das

-Regribut von . Dadurch wird automatisch ein Rechteck für jedes Element in der Sammlung generiert.

<.> 4. Stilbindung (optional):

RectItems ItemsControl Sie können wählen, ob Sie die Stilbindung, die Attribute ItemsSource und

entsprechend den X- und Y -Attributen jedes rechteckigen Elements verwenden möchten.

<.> 5. Alternatives Schema (keine Stilbindung):

Wenn der Stil an Ihre Umgebung gebunden ist (z. B. UWP), können Sie die Rendering -Transformation in der rechteckigen Vorlage verwenden: Canvas.Left Canvas.Top

Mit dieser Methode können Sie das Rechteck in den ViewModel -Daten dynamisch hinzufügen und anzeigen, unabhängig von der Anzahl der Rechtecke beim Ausführen.

Das obige ist der detaillierte Inhalt vonWie füge ich mit MVVM rechteckige Rechtecke zu einer WPF -Leinwand hinzu?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!