Wie kann ich Rechtecke in einer WPF -Anwendung mit dem MVVM -Muster dynamisch anzeigen?

Verwenden Sie den MVVM -Modus, um das Rechteck in der WPF -Anwendung

anzuzeigen In WPF -Anwendungen müssen Sie möglicherweise einen Satz von Rechtecken entsprechend den Daten dynamisch hinzufügen. Dies kann im MVVM-Modus (Model-View-View-Modell) implementiert werden.

Betrachten Sie ein Ansichtsmodell, das eine rechteckige Sammlung eines Abstract enthält, das durch das

-Objekt angegeben ist:

RectItem

<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; }
}</code>

In der Ansicht können Sie

<code class="language-csharp">public class ViewModel
{
    public ObservableCollection<RectItem> RectItems { get; set; } = new ObservableCollection<RectItem>();
}</code>

mit

Canvas verwenden, um diese Sammlung anzuzeigen: ItemsPanel ItemsControl

Eine andere Methode besteht darin,

<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>

anstatt im Stil Setter zu binden:

RenderTransform

Durch die Verwendung dieser Technologien können Sie dynamisch einen Satz von Rechtecken basierend auf den im Ansichtsmodell gespeicherten Daten anzeigen, um eine flexible und schnelle Antwort Benutzeroberfläche bereitzustellen. Beide Methoden können eine dynamische rechteckige Anzeige effektiv erreichen, und Sie können eine bessere geeignetere entsprechend den spezifischen Anforderungen auswählen.

<code class="language-xml"><ItemsControl ItemsSource="{Binding RectItems}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <Canvas />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Rectangle Fill="Black" Height="{Binding Height}" Width="{Binding Width}">
                <Rectangle.RenderTransform>
                    <TranslateTransform X="{Binding X}" Y="{Binding Y}" />
                </Rectangle.RenderTransform>
            </Rectangle>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl></code>

Das obige ist der detaillierte Inhalt vonWie kann ich Rechtecke in einer WPF -Anwendung mit dem MVVM -Muster dynamisch anzeigen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!