WPF Zoomcontroll für Wellenform mit polyline gesucht

Chiller

Moin moin
Ich schreibe gerade an einem Programm, welches eine Welle darstellen können soll und auch eine Detailansicht (Gezoomte Ansicht) bieten soll.

Ich habe für die Detailansicht ein Grid gemacht, welches die Wellenformen darstellt, diese sind bereits richtig positioniert und skalliert. Jetzt muss ich aber in diese Darstellung reinzoomen können.

Bild des aktuellen Projekts

Im Bild seht ihr im unteren Teil die Gesamtansicht, dort kann man mit einem Auswahlrechteck die Ansicht der Detailansicht einstellen.
In der Detailansicht wird dann genau der ausgewählte Bereich dargestellt.

Ich habe versucht das Problem mit dem LayoutTransform des Grids zu lösen, aber dann hat sich nur die liniendicke verändert. Wenn ich Rendertransform verwendet habe, sind die Linien über dem Grid rausgewachsen.
Mit einem Scrollviewer habe ich es auch schon versucht, bin aber nicht zum gewünschten Resultat gekommen.

Nur mit LayoutTransform

<Grid Name="WaveGrid" Margin="5">
    <Grid.LayoutTransform>
        <ScaleTransform x:Name="GridScale" />
    </Grid.LayoutTransform>
</Grid>

Mit Scrollviewer

<ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
    <Grid Name="WaveGrid" Margin="5">
        <Grid.LayoutTransform>
            <ScaleTransform x:Name="GridScale" />
        </Grid.LayoutTransform>
    </Grid>
</ScrollViewer>

Kann mir jemand erklären wie ich das Problem lösen kann?

Edit (01.05.2012):
Ich verwende Polylines welche ich in Grid Columns und Rows stecke, damit sie richtig positioniert sind. Damit sie richtig dargestellt werden, ist das Stretch Property auf Fill eingestellt. Vieleicht hat das etwas damit zu tun...

Grüsse
Chiller

Chiller

Hat niemand eine Idee wie man in eine Wellenform reinzoomen kann?
Mir geht es nicht um einen fixfertigen Control, sondern nur darum zu erfahren, was ich ändern muss, damit der Zoomvorgang funktioniert...

Grüsse
Chiller

Dravere

Chiller schrieb:

Hat niemand eine Idee wie man in eine Wellenform reinzoomen kann?

Es ist ja noch nicht einmal einen Tag vergangen!

Du suchst somit eine Lupe für WPF?
http://social.msdn.microsoft.com/Search/en-us?query=WPF magnifier&ac=8

Chiller schrieb:

Mir geht es nicht um einen fixfertigen Control, sondern nur darum zu erfahren, was ich ändern muss, damit der Zoomvorgang funktioniert...

Ohne genauere Informationen darüber zu erhalten, wie du den Graph zeichnest und du die Lupe anwendest, wird das wahrscheinlich schwer. Und ob sich jemand dann die Mühe macht, alles anzuschauen und den Fehler zu verstehen, ist durchaus fraglich

Ich empfehle ein Minimalbeispiel zu erstellen und es darin zu testen. So ein Beispiel kannst du hier dann auch präsentieren. Dann kann es sich auch jeder selbst kurz anschauen und ausprobieren

Grüssli

Chiller

Dravere schrieb:

Es ist ja noch nicht einmal einen Tag vergangen!

Hmm, tut mir leid, aber da ich gerade noch 6 Tage habe bis ich diese Arbeit abgeben muss, bin ich etwas im Stress. Ich versuche aber etwas geduldiger zu sein.

Ich habe mal n test xaml gemacht, dort funktioniert es genau so wenig wie sonst.

<Window x:Class="GraphZoomer.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="292" Width="525" Background="#FF7FFFFF">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="5" />
            <ColumnDefinition Width="23" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="5" />
            <RowDefinition Height="23" />
        </Grid.RowDefinitions>

        <Slider Name="sld_Horizontal" Grid.Row="2" Minimum="1" />
        <Slider Name="sld_Vertical" Grid.Column="2" Orientation="Vertical" Minimum="1" />

        <Grid>
            <Grid.LayoutTransform>
                <ScaleTransform ScaleX="{Binding ElementName=sld_Horizontal, Path=Value}" ScaleY="{Binding ElementName=sld_Vertical, Path=Value}">
                </ScaleTransform>
            </Grid.LayoutTransform>

            <Rectangle Fill="White" />        
            <Polyline Stretch="Fill" Stroke="Black">
            <Polyline.Points>
                <Point>0,0</Point>
                <Point X="1" Y="-2.5" />
                <Point X="2" Y="-4" />
                <Point X="3" Y="-4.5" />
                <Point X="4" Y="-4" />
                <Point X="5" Y="-2.5" />
                <Point X="6" />
            </Polyline.Points>
            </Polyline>            
        </Grid>
    </Grid>
</Window>

Das Program findet ihr hier

Hoffe jemand findet was.

Grüsse
Chiller

Chiller

Hey
Wenn ich mit Rendertransform den Grid grösser mache, dann geht er über den beinhaltenden Containerrand hinaus.
Gibt es eine Möglichkeit wie ich machen kann, dass nur der Teil innerhalb des beinhaltenden Containers angezeigt wird?

Der Container ist z.B. ein UserControll.

Grüsse
Chiller

Chiller

Ok, ich habe es gelöst.

Wem es interessiert:
Ich musste die Skallierung auf die einzelnen Polys anwenden und beim beinhaltenden Grid das Property 'ClipToBounds' auf true setzen.

Jetzt habe ich nur noch ein Problem, nämlich dass das Zentrum der ScalaTransforms aus irgend einem Grund nicht ganz genau dort ist wo ich ihn haben will.
Statt dessen "verzerrt" sich das Ganze.

Grüsse
Chiller

EXDW

- Nimm RenderTransform statt LayoutTransform, dadurch beeinflusst du nicht die Positionierung
- Setz im Grid das "RenderTransformOrigin" auf "0.5,0.5" (nur zur Sicherheit)

Chiller

Hmmm, merci für den Tip, aber leider war das nicht das Problem.

Wenn ich den RenderTransformOrigin auf 0.5 setze, dann verschiebt sich die Verzerrung nur.

Mal etwas Code:

Das brauche ich um den Grid zu skallieren, der Grid beinhaltet dann alle Wellenformen.

<UserControl x:Class="ProjectPageControlls.Detailview"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" mc:Ignorable="d" 
             d:DesignHeight="147" d:DesignWidth="416" Background="LightYellow" MouseMove="UserControlMouseMove" ClipToBounds="True">
    <Grid Name="WaveGrid" >
        <Grid.RenderTransform>
            <ScaleTransform x:Name="RenderScale"></ScaleTransform>
        </Grid.RenderTransform>
        <Grid.LayoutTransform>
            <ScaleTransform x:Name="LayoutScale"></ScaleTransform>
        </Grid.LayoutTransform>
    </Grid>
</UserControl>

Damit die Wellen gezoomt werden können, berechne ich das Ganze neu sobald es nötig ist:

this.LayoutScale.ScaleX = this.WaveContainer.CameraZoom.Width;
this.LayoutScale.ScaleY = this.WaveContainer.CameraZoom.Height;

this.RenderScale.ScaleX = 1 / this.WaveContainer.CameraZoom.Width;
this.RenderScale.ScaleY = 1 / this.WaveContainer.CameraZoom.Height;

this.RenderScale.CenterX = this.WaveContainer.CameraCenter.X * this.ActualWidth;
this.RenderScale.CenterY = this.WaveContainer.CameraCenter.Y * this.ActualHeight;

Die Werte CameraZoom und CameraCenter sind prozentual (0...1) angegeben und bestimmen die relative Grösse und Position auf dem Grid.
Die LayoutScale verwende ich, damit die Wellenformen nicht dicker werden

Wenn ihr das Problem anschauen wollt, könnt ihr das Ganze Programm hier downloaden.
Mit dem Programm könnt ihr eine Welle aus dem Ordner Messdaten importieren, am besten einen Sinus.
Dann könnt ihr den Fehler sehen.

Grüsse
Chiller

Chiller

Hat bis jetzt noch niemand eine Idee woran es liegen könnte?
Ich wäre echt froh darüber, wenn ich die Applikation am Mittwoch wenigstens mit einem sauberen Zoom abgeben könnte...

Grüsse
Chiller