Ein DataTemplate überblendbar machen

Question

Wie kann ich ein Datatemplate für ein ViewModel blendable (designable in expression blend) machen. Wenn ich zu den Ressourcen gehe und versuche, das DataTemplate direkt zu bearbeiten, ist alles, was ich auf dem Drawingborad sehe, ein leeres Rechteck. Das liegt daran, dass das DataTemplate nicht an etwas gebunden ist. Natürlich kann ich ein UserControl erstellen und dort einige Designtime-Daten im Code erstellen, um die Vorlage zu sehen, aber ich müsste jetzt zwischen der Ressource (zum Bearbeiten) und dem UserControl (um das Ergebnis meiner Bearbeitung zu sehen) hin und her wechseln. Gibt es nicht eine direktere Möglichkeit, mein DataTemplate zu bearbeiten und zu sehen?

Answer 1

Es ist ein bisschen schwierig, es zu benutzen, aber Blend hat eine Funktion namens "Design-Time Data", die dir dabei helfen kann. Am Anfang ist es schwierig, aber wenn man ein paar davon gemacht hat, ist es ziemlich einfach. Es zwingt einen auch in ein schönes Muster für DataContext.

Hier ist ein guter Link zu diesem Thema: http://www.robfe.com/2009/08/design-time-data-in-expression-blend-3/

Hier ein paar ausgewählte Auszüge:

Über Design-Time-Größen

...können die Eigenschaften der Entwurfszeit sicher von anderen Werkzeugen ignoriert werden und sie werden zur Laufzeit ignoriert (mc:Ignorable gibt an, dass der Namespace mit dem Präfix "d" ignoriert werden kann ignoriert werden kann).

 xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
 xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
 mc:Ignorable="d"

Expression Blend verwendet zwei Entwurfszeiten Eigenschaften (d:DesignWidth, d:DesignHeight), um eine Größe für ein Steuerelement, das zur Entwurfszeit verwendet werden soll...

Über Datenquellen zur Entwurfszeit

Ich bin über d:Datacontext gestolpert, als ich mit Blend 3 spielte und versuchte eine "Live-Datenquelle" zu meinem Fenster Fenster hinzuzufügen. Ich dachte, es würde zu genauso verhalten wie die alte Methode einen DataContext zu setzen, aber als ich meine Anwendung startete, gab es keine Daten! ...

Das Ergebnis ist also, dass wir jetzt schreiben können Code wie diesen schreiben:

...
<Grid ...
      DataContext="{StaticResource GameDataSource}"
      d:DataContext="{StaticResource DesignTime_DateDataSource}">

Beachten Sie, dass dies für Blend 3 gilt, wenn Sie die Unterstützung von Erstanbietern für diese Funktionen wünschen. Sie sind ziemlich gut - es gibt sogar einen Designer für die Design-Time-Daten, obwohl ich noch nicht in diese Funktionen geschaut habe.

Anwenden auf DataTemplates

Das ist etwas, das ich mir ausgedacht habe, aber es scheint zu funktionieren. Hier verwende ich die Design-Time-Datenfunktion, um Daten in den d:DataContext des visuellen Elements zu ziehen. Sie müssen Folgendes tun für jedes Element der obersten Ebene, für das ein DataContext gesetzt werden musste .

<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">
    <!-- Resource dictionary entries should be defined here. -->
    <DataTemplate x:Key="MyTemplate">
        <TextBlock Text="{Binding Text}" d:DataContext="{StaticResource SampleDataSource}" />
    </DataTemplate>
</ResourceDictionary>

Die Bindungssyntax ist ein wenig expliziter, wenn Sie ein DataTemplate mit einem DataType-Satz verwenden, aber es funktioniert trotzdem:

<DataTemplate DataType="{x:Type vm:MyViewModel}" >
   <TextBlock Text="{Binding Text}" 
              d:DataContext="{Binding Source={StaticResource SampleDataSource}}" />
</DataTemplate>

Mit dieser Strategie können Sie sehen, wie das DataTemplate funktionieren wird während der direkten Bearbeitung Sie werden das Ergebnis jedoch in keiner Ansicht sehen können, die dieses DataTemplate verwendet, es sei denn, Sie führen die Anwendung tatsächlich aus. Dies ist eine Einschränkung von Blend im Moment aufgrund der Tatsache, dass sie nicht zu sein scheinen mit Mocks, sondern komplette Ersatz-Objekte. Wenn Blend jemals die Möglichkeit hinzufügt, eine neue gefälschte Datenquelle zu erstellen, indem Sie auf "New DataSource -> Based on Referenced Object -> MyCustomerObject" klicken, dann werden Sie im Geschäft sein.

Es ist möglich, dass Sie diese Einschränkung mit einem eigenen Trick mit angehängtem Eigentum überwinden können, aber es wäre bestenfalls schwierig.

Alternative

Eine Alternative, die funktioniert in cada Situation, ist aber etwas umständlicher einzurichten, ist die Einrichtung von StaticResources, die während der Laufzeit gefälschte Daten gegen echte Daten austauschen, aber im Designer statische Beispieldaten anzeigen.

Hier ist ein wirklich großartiger Artikel von Karl Shifflett, der einige dieser Techniken und ein paar Videos dazu enthält: http://karlshifflett.wordpress.com/2008/10/11/viewing-design-time-data-in-visual-studio-2008-cider-designer-in-wpf-and-silverlight-projects/

Ich hoffe, das hilft, Anderson

Answer 2

Mit dieser Strategie können Sie sehen wie das DataTemplate funktionieren wird, während direkt bearbeiten, aber Sie werden nicht können Sie das Ergebnis in jeder Ansicht sehen die das DataTemplate verwendet, es sei denn Sie die Anwendung tatsächlich ausführen. Dies ist eine Einschränkung von Blend im Moment, da der Tatsache geschuldet, dass sie anscheinend nicht Mocks zu verwenden, sondern eher komplette Ersatzobjekte. Wenn Blend jemals die Fähigkeit hinzufügt, eine neue Fälschung zu erstellen Datenquelle durch Klicken auf "New DataSource -> Basierend auf referenziertem Objekt -> MyCustomerObject", dann sind Sie im Geschäft sein.

Wenn ich acutal ViewModel mocks verwenden möchten, ich denke, es ist der beste Weg, um tatsächliche ViewModel-Instanzen zu erstellen und die Referenzen Sie mit d:DataContext (z.B. mit einem ObjectDataProvider oder x:Static)