Come disegnare le barre di scorrimento su WPF Canvas

Question

Sto provando a creare una tela con barre di scorrimento. Qualcuno può aiutarmi a dare qualche idea su come farlo? Ho già provato a utilizzare la griglia di 1 riga e 1 colonna, ma a causa di alcuni vincoli, voglio utilizzare la tela.

Grazie in anticipo!

Answer 1

Si può inserire la tela all'interno di uno scrollviewer. Ho provato questo test rapido e mi ha permesso di scorrere il contenuto della tela.

<ScrollViewer Height="100" Width="200"> 
    <Canvas Height="400" Width="400"> 
      //Content here 
    </Canvas> 
</ScrollViewer> 

Edit: Ecco un esempio in cui le barre di scorrimento appaiono solo quando è necessario, e cambia dinamicamente al variare della dimensione del quadro.

<Button Content="Change Canvas Size" Click="ChangeCanvasSize_Click"/> 
<ScrollViewer Height="100" Width="200" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto"> 
    <Canvas x:Name="TestCanvas"> 
      <TextBlock Text="Test Test"/> 
    </Canvas> 
</ScrollViewer> 

modificare le dimensioni delle tele con pulsante di scatto:

private void ChangeCanvasSize_Click(object sender, RoutedEventArgs e) 
    { 
     TestCanvas.Width = 600; 
     TestCanvas.Height = 600; 
    } 

In questo esempio, iniziare con senza barre di scorrimento e quando clicco sul pulsante per espandere la tela, scroll-bar apparire.

Answer 2

Ok, dopo aver lavorato con lui per un po 'ho capito un modo. Creare un XAML come questo

<ScrollViewer> 
<Grid x:Name="drawingGrid" SizeChanged="drawingGrid_SizeChanged"> 
<Canvas Name="drawingCanvas"> /<Canvas> 
</Grid> 
</ScrollViewer> 

Nella finestraLa funzione di caricamento imposta l'altezza/larghezza della tela in base all'altezza/larghezza della griglia. Aggiorna la tela ht/wd:

1. quando la dimensione della griglia cambia, a causa di mininmize/maxim.

2. trascinando un elemento oltre i confini della tela o la creazione di un nuovo elemento troppo vicino al bordo della tela

   double dHeight = 220; 
   if (drawingCanvas.Height < CurrentPosition.Y + dHeight) 
   { 
       // increase canvas height 
       drawingCanvas.Height += (2 * dHeight); 
   } 
   

Spero che questo è di qualche aiuto. Si prega di condividere se qualcuno ha qualche idea o suggerimento migliore per migliorare questo.

Answer 3

Combinando la risposta di Mario-sannum e la tua domanda allora ho fatto una soluzione che dovrebbe funzionare bene nella maggior parte dei casi ..

<ScrollViewer> 
<Grid x:Name="drawingGrid" SizeChanged="drawingGrid_SizeChanged"> 
<Canvas Name="c"> 
<TextBlock x:Name="draw_Text" Text="Test Test"/> 
</<Canvas> 
</Grid> 
</ScrollViewer> 


void drawingGrid_SizeChanged(object sender, SizeChangedEventArgs e) 
{ 
     try { c.Height = draw_Text.ActualHeight; } catch { } 
     try { c.Width = draw_Text.ActualWidth; } catch { } 
} 

Questo dovrebbe ridimensionare le Canvas in modo che lo ScrollViewer può scorrere ...