2014-01-28 5 views
0

У нас есть требование для абсолютного макета, который позволяет прокручивать его содержимое (дочерние элементы управления). Макет и все дочерние элементы управления создаются и добавляются «на лету» во время запуска приложения; В результате XAML НЕ является вариантом для создания макета.WP8 Canvas внутри Scrollviewer - ДОЛЖЕН БЫТЬ КОДЕКСОМ

К сожалению, с кодом, стоящим за ним, чрезвычайно сложно достичь желаемого поведения прокрутки; в отличие от 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# код, можно добиться того же «смотреть», только содержание никогда не прокручивается.

Кто-нибудь знает, как добиться такого же результата с помощью кода? Или знаете расположение примера, который делает именно это ИСПОЛЬЗОВАНИЕ с использованием кода?

ответ

0

Проблема была проблема с родительско-дочерние отношения.

Первоначально у меня был ScrollViewer (SV) и основной холст (MC).

Проблема заключалась в том, что MC был добавлен как ребенок другого контейнера, хотя MC был установлен как содержимое SV.

Решение было изменит родителя SV в 3-м Холст (3C), что делает иерархию [родительский -> ребенок]:

3C -> СВ -> MC

Ширина и высота может затем быть применена к 3C & SV, оставляя MC для автоматической сортировки в соответствии с его содержимым.

Поскольку MC становится больше SV & 3C, он позволяет прокручивать.

Все дети будут добавлены MC исключительно

0

Его Easy

  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; 

Надеется, что это помогает

0

код XAML переводится в C# кода простого способа. Вот фрагмент кода C#, который будет создавать выше XAML:

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); 
} 
+0

Спасибо за ваш ответ, но что-то должно быть другим, это как будто ScrollPanel рос, чтобы соответствовать размеру холста, в результате чего была отодвинута от экрана. Если я играю с размерами, я также вижу, что кнопки «переполняют» границы контейнера, когда я ожидал, что ScrollViewer «закроет» любые дочерние элементы управления за пределами его видимого окна. Каковы правила для ScrollViewer в отношении настройки его высоты/ширины? Должно ли это быть само по себе? – Gov

Смежные вопросы