WP8畫布內滾動查看器 - 必須代碼隱藏

Question

我們有一個絕對佈局的要求，允許滾動它的內容（子控件）。佈局和所有的Child控件都是在應用程序運行期間隨時創建和添加的;因此，XAML不適用於創建佈局。

不幸的是，使用後面的代碼很難實現所需的滾動行爲;與XAML不同，我們可以非常簡單地實現它。

下面的XAML演示所需的行爲

<phone:PhoneApplicationPage 
    x:Class="TestWP8App.MainPage" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone" 
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d" 
    FontFamily="{StaticResource PhoneFontFamilyNormal}" 
    FontSize="{StaticResource PhoneFontSizeNormal}" 
    Foreground="{StaticResource PhoneForegroundBrush}" 
    SupportedOrientations="Portrait" Orientation="Portrait" 
    shell:SystemTray.IsVisible="True"> 
<ScrollViewer HorizontalAlignment="Left" VerticalAlignment="Top" Width="480"> 
    <Canvas Height="1500"> 
     <Button Content="1" Height="300" Canvas.Left="10" Canvas.Top="10" Width="120"/> 
     <Button Content="2" Height="300" Canvas.Left="10" Canvas.Top="110" Width="120"/> 
     <Button Content="3" Height="300" Canvas.Left="10" Canvas.Top="210" Width="120"/> 
     <Button Content="4" Height="300" Canvas.Left="10" Canvas.Top="310" Width="120"/> 
     <Button Content="5" Height="300" Canvas.Left="10" Canvas.Top="410" Width="120"/> 
    </Canvas> 
</ScrollViewer> 
</phone:PhoneApplicationPage> 

通過上述特性轉換爲C＃代碼，這是可能達到相同的「看」，只有內容從未滾動。

有誰知道如何通過代碼隱藏實現相同的結果嗎？或者知道一個例子的位置，完全是這樣使用代碼隱藏的嗎？

Answer 1

問題是父子關係的問題。

最初我有一個ScrollViewer（SV）和一個主畫布（MC）。

問題在於即使將MC設置爲SV的內容，MC也被添加爲其他容器的子項。

的解決方案是重新設置父級SV在第三畫布（3C）使層次[父 - >子]：

3C - > SV - > MC

寬度，然後高度可以被應用到3C & SV，讓MC根據其內容自動調整大小。

由於MC獲得的尺寸大於SV & 3C，因此允許滾動。

所有的孩子都加入到MC專門

Answer 2

它很容易

  ScrollViewer sViewer = new ScrollViewer() {HorizontalAlignment=HorizontalAlignment.Left,VerticalAlignment=VerticalAlignment.Top,Width480 }; 
      Canvas cc = new Canvas() { Height=1500}; 
      //same for all the buttons 
      Button b1 = new Button() { Height=300,Width=120,Content="1"}; 
      Canvas.SetLeft(b1, 10); 
      Canvas.SetTop(b1, 10); 
      //adding the canvas into sViewer 
      sViewer.Content = cc; 

希望它可以幫助

Answer 3

XAML代碼轉換成C＃代碼以直接的方式。以下是將創建上述XAML的C＃代碼片段：

var scrollViewer = new ScrollViewer 
{ 
    HorizontalAlignment = HorizontalAlignment.Left, 
    VerticalAlignment = VerticalAlignment.Top, 
    Width = 480 
}; 

var canvas = new Canvas 
{ 
    Height = 1500 
}; 

scrollViewer.Content = canvas; 

for (var i = 1; i <= 5; ++i) 
{ 
    var button = new Button 
    { 
     Width = 120, 
     Height = 300 
     Content = i.ToString() 
    }; 
    Canvas.SetLeft(button, 10); 
    Canvas.SetTop(button, (i - 1) * 100 + 10)); 
    canvas.Children.Add(button); 
}