Bilder ausrichten in WPF canvas in der Mitte

Bin ich die Entwicklung einer Bild-viewer, basierend auf gesten mit der Kinect. Ich bin mit dem folgenden XAML-code zur Anzeige von Bildern auf einer Leinwand.

    <Canvas Background="Transparent" Height="732" VerticalAlignment="Top">
        <Image x:Name="next" Source="{Binding NextPicture}" StretchDirection="Both" Stretch="Uniform" ClipToBounds="True" SnapsToDevicePixels="True" RenderOptions.BitmapScalingMode="HighQuality" RenderTransformOrigin="0.5,0.5" Opacity="0" Grid.ColumnSpan="2" Height="732" Width="Auto" HorizontalAlignment="Center" />
        <Image x:Name="previous" Source="{Binding PreviousPicture}" StretchDirection="Both" Stretch="Uniform" ClipToBounds="True" SnapsToDevicePixels="True" RenderOptions.BitmapScalingMode="HighQuality" RenderTransformOrigin="0.5,0.5" Opacity="0" Grid.ColumnSpan="2" Height="732" Width="Auto" HorizontalAlignment="Center" />
        <Image x:Name="current" Source="{Binding Picture}" StretchDirection="Both" Stretch="Uniform" ClipToBounds="True" SnapsToDevicePixels="True" RenderOptions.BitmapScalingMode="HighQuality" RenderTransformOrigin="0.5,0.5" Grid.ColumnSpan="2" Height="732" Width="Auto" HorizontalAlignment="Center" />
    </Canvas>

Dies ist der code, der ausgeführt, in den Rücken:

    ///<summary>
    ///Gets the previous image displayed.
    ///</summary>
    public BitmapImage PreviousPicture { get; private set; }

    ///<summary>
    ///Gets the current image to be displayed.
    ///</summary>
    public BitmapImage Picture { get; private set; }

    ///<summary>
    ///Gets the next image displayed.
    ///</summary>
    public BitmapImage NextPicture { get; private set; }

Jedes mal, wenn eine Geste erkannt wird, die Eigenschaften geändert werden, wie gezeigt:

    //Setup corresponding picture if pictures are available.
                this.PreviousPicture = this.Picture;
                this.Picture = this.NextPicture;
                this.NextPicture = LoadPicture(Index + 1);

                //Notify world of change to Index and Picture.
                if (this.PropertyChanged != null)
                {
                    this.PropertyChanged(this, new PropertyChangedEventArgs("PreviousPicture"));
                    this.PropertyChanged(this, new PropertyChangedEventArgs("Picture"));
                    this.PropertyChanged(this, new PropertyChangedEventArgs("NextPicture"));
                }

Das problem ist jedoch, die Bilder, die ich auf der Leinwand bekommen, ausgerichtet nach dem Zufallsprinzip nach Links oder rechts. Auch Ihr Seitenverhältnis ändert sich manchmal. Was ich will ist, das die Bilder angezeigt werden sollen, auf der Mitte der Leinwand in Ihrem ursprünglichen Seitenverhältnis. Kann mir jemand helfen diesbezüglich?

Ich bin auch in der Lage, um das Bild auf die Mitte mit der C# - code wie folgt:

    Canvas.SetLeft(current, (1249 - current.ActualWidth) / 2);
    Canvas.SetTop(current, 0);

wo "Strom" ist der name des aktuellen Bildes im XAML-code. Es soll aber automatisch geschehen. Ist es möglich, in der XAML-code? Wenn nicht, wie kann ich es erreichen?

PS: ich bin nicht so gut in C# oder WPF. Also bitte erklären Sie in einfachen Worten, wenn möglich.

Gibt es einen Grund, Sie verwenden ein Canvas enthalten Steuerelemente? Ein Grid würde viel besser funktionieren, da könnte man einfach HorizontalAlignment und VerticalAlignment Ihre Bilder zu Center.
Ja. Ich bin eigentlich die übersetzung meiner hand koordiniert in position relativ zu dem Bildschirm und dann durch schwenken eines vergrößerten Bilds durch einstellen der 'Leinwand.Links' und 'Leinwand.Top-Eigenschaften in meinem code. Ich habe versucht, mit "Übersetzen-Transformation', aber ich konnte nicht herausfinden, ein Weg, mit diesem.

InformationsquelleAutor Karan Thakkar | 2012-10-03

c#canvas wpf xaml

2

Könnte man zentrieren des Bildes in der XAML-durch die Bindung der Canvas.Left Eigenschaft mit einem IMultiValueConverter, die Parameter akzeptiert Ihre Canvas.Width und Image.Width und zurück (Canvas.Width /2) - (Image.Width /2) jedoch pro Ihr Kommentar oben, es klingt wie Sie die Benutzer zu re-positionieren Sie ein Bild mit Handbewegungen durch die Einstellung Canvas.Left des Bildes, und diese überschreiben würde Ihre Bindung mit dem Konverter.

Ich würde eigentlich empfehlen mit einem Grid statt einer Canvas, und positionieren Sie das Bild mithilfe HorizontalAlignment=Center, und erlauben Benutzern, passen Sie die position des Bildes durch die Verwendung eines RenderTransform (Beachten Sie, dass Sie brauchen, um zu verwenden RenderTransform, nicht LayoutTransform, damit die transformation angewendet wird zum Zeitpunkt des Renderns, nicht bei der WPF wird versucht, das layout Ihrer Objekte).

Wenn das nicht funktioniert, würde ich das Bild ändern von Eigenschaften aus BitmapImages in eine eigentliche Klasse, die das Bild mit Eigenschaften für BitmapImage, Top, und Left. Zu bewegen Bilder, die Sie ändern würde die Picture.Left Eigenschaft, und wenn der Benutzer den Schalter Bilder können Sie zurücksetzen der Picture.Left - Eigenschaft auf den ursprünglichen Wert
- Ich machte einen dummen Fehler in der Verwendung von Render-Transformation. Ihre Arbeitsweise. Danke für den Tipp 🙂
InformationsquelleAutor Rachel
0

Ich würde die Leinwand. Verwenden Sie eine kleine Methode, wenn die app startet, um zu bestimmen, die in der Mitte Ihres Bildschirmes. Holen Sie sich die Größe des Fensters durch zwei teilen und dann verwenden, die als start für die position der Bilder. Für kinect Steuern würde ich definitiv Leinwand.

InformationsquelleAutor kbo4sho88

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.