Canvas Scrollviewer中的WP8画布-必须是代码隐藏

Canvas Scrollviewer中的WP8画布-必须是代码隐藏,canvas,windows-phone-8,code-behind,scrollviewer,Canvas,Windows Phone 8,Code Behind,Scrollviewer,我们有一个绝对布局的要求,允许滚动它的内容(子控件的)。布局和所有子控件在应用程序运行期间动态创建和添加;因此,XAML不是创建布局的选项 不幸的是,由于代码落后,很难实现所需的滚动行为;与XAML不同,我们可以非常简单地实现它 下面的XAML演示了所需的行为 <phone:PhoneApplicationPage x:Class="TestWP8App.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xam

我们有一个绝对布局的要求,允许滚动它的内容(子控件的)。布局和所有子控件在应用程序运行期间动态创建和添加;因此,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#代码,可以实现相同的“外观”,只是内容永远不会滚动

有人知道如何通过代码隐藏实现相同的结果吗?或者知道一个仅使用代码隐藏就可以做到这一点的示例的位置

很容易

            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;

希望对您有所帮助

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);
}
var scrollViewer=新的scrollViewer
{
水平对齐=水平对齐。左,
垂直对齐=垂直对齐。顶部,
宽度=480
};
var canvas=新画布
{
高度=1500
};
scrollViewer.Content=canvas;

对于(var i=1;i而言,问题在于亲子关系

最初我有一个ScrollViewer(SV)和一个主画布(MC)

问题是,MC被添加为其他容器的子容器,即使MC被设置为SV的内容

解决方案是在第三个画布(3C)中重新绘制SV,使层次结构[parent->child]:

3C->SV->MC

宽度和高度可以应用于3C&SV,让MC根据其内容自动调整大小

当MC变得比SV&3C更大时,它允许滚动


所有的孩子都被专门添加到MC中

感谢您的回复,但一定会有所不同,就好像ScrollPanel已经增长到与画布的大小相匹配,结果被推到了屏幕之外。如果我玩这些大小,我还可以看到按钮“溢出”了容器的边界,而我本该看到ScrolllViewer可“剪辑”其可视窗口之外的任何子控件。ScrollViewer的高度/宽度设置规则是什么?是否应自行调整大小?