ScaleTransform trasformate non lineare

Question

Sto usando scala trasformare per consentire a un utente di ridimensionare un controllo. Quello che succede è però che quando si inizia a spostare il mouse il controllo passa a un nuovo formato, e poi scale stranamente. Più ci si sposta il mouse dalla posizione di partenza il più grande l'aumento delle dimensioni diventa.

Mi aspetto che il suo il mio modo di calcolare la scala da applicare. Ecco il codice:

private void ResizeGrip_MouseDown(object sender, MouseButtonEventArgs e)
{
    ResizeHandle.CaptureMouse();

    //Get the initial coordinate cursor location on the window
    initBtmX = e.GetPosition(this).X;

    bottomResize = true;
}

private void ResizeGrip_MouseUp(object sender, MouseButtonEventArgs e)
{
    bottomResize = false;
    ResizeHandle.ReleaseMouseCapture();
}

private void ResizeGrip_MouseMove(object sender, MouseEventArgs e)
{
    if( bottomResize == true)
    {
        //Get the new Y coordinate cursor location
        double newBtmX = e.GetPosition(this).X;


        //Get the smallest change between the initial and new cursor location
        double diffX = initBtmX - newBtmX;

        // Let our rectangle capture the mouse
        ResizeHandle.CaptureMouse();

        double newWidth = e.GetPosition(this).X - diffX;

        double scaler = newWidth / ResizeContainer.ActualWidth;

        Console.WriteLine("newWidth: {0}, scalar: {1}", newWidth, scaler);


        if (scaler < 0.75 || scaler > 3)
            return;

        ScaleTransform scale = new ScaleTransform(scaler, scaler);

        ResizeContainer.LayoutTransform = scale;
    }
}

Aggiornamento: Ora con XAML

<wtk:IToolDialog x:Name="VideoPlayer" ParentControl="{Binding ElementName=Stage}" DialogTitle="Video Player" Margin="90,5,0,0">
    <Grid> 
        <Grid x:Name="ResizeContainer" ClipToBounds="True" Width="320" Height="240" HorizontalAlignment="Center" VerticalAlignment="Bottom" Margin="0,0,0,1">
            <!-- The video frame -->
            <Image Stretch="Fill" Source="{Binding CurrentFrameImage}" x:Name="VideoImage" />
            <Grid>
                <pplcontrols:VideoGroundPlane Foreground="Black" GridSize="20" GroundPlane="{Binding GroundPlane}">
                </pplcontrols:VideoGroundPlane>
            </Grid>
            <Grid x:Name="HitMask" IsHitTestVisible="False"/>
        </Grid>
        <ResizeGrip Cursor="SizeNWSE" x:Name="ResizeHandle" VerticalAlignment="Bottom" HorizontalAlignment="Right" Mouse.MouseDown="ResizeGrip_MouseDown" Mouse.MouseUp="ResizeGrip_MouseUp" Mouse.MouseMove="ResizeGrip_MouseMove"></ResizeGrip>
    </Grid>
</wtk:IToolDialog>

Answer 1

Qual è il motivo per cui non si utilizza ResizeContainer.RenderTransfrom invece di ResizeContainer.LayoutTransform? Cioè uso

ResizeContainer.LayoutTransform = scale;

Se si desidera che la scala per essere lineare Credo che si dovrebbe usare

double scaler = 1 - diff / ResizeContainer.ActualWidth;

---

Modifica

C'è un bug nel codice che fa sì che il controllo di scalata a "saltare" in termini di dimensioni, se si tenta di ridimensionare più di una volta. Vi suggerisco di fare il seguente:

Aggiungere un RenderTransform alla griglia ResizeContainer:

<Grid.RenderTransform>
    <ScaleTransform x:Name="transform" ScaleX="1" ScaleY="1" />
</Grid.RenderTransform>

Modificare il codice nel tuo gestore di eventi MouseMove al seguente:

if (bottomResize)
{
    double newBtmX = e.GetPosition(this).X;
    double scaler = -(initBtmX - newBtmX) / grid1.ActualWidth;
    initBtmX = newBtmX;

    transform.ScaleX += scaler;
    transform.ScaleY += scaler;
}

In questo modo si cambia la scala con qualsiasi piccola quantità il mouse si è mosso durante il trascinamento. Tutti i controlli figlio all'interno della griglia dovrebbero scalare pure.