8

I haven't found Information for this problem for Blend / WPF yet. Just for Eclipse and this won't help.

I am currently designing a WPF 4 Application Dialog. It should be a ScrollViewer with different Elements within a StackPanel:

<ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" Height="470" VerticalAlignment="Top">
  <StackPanel Height="1893" Width="899">
    <!-- Elements here ... -->
  </StackPanel>
<ScrollViewer>

So far everything works as expected. The Scrollbar is visible. My Problem is that I am unable to scroll down in design time within Blend or Visual Studio 2012. Running the Project works fine and the user can scroll down to other objects.

But in Design Time there seems to be no chance to scroll down to positioning the (now hidden) Controls accuratly.

One Solution for this is to expand the Control to show the complete content. But that can't be the best Solution. Does anyone have a clue for proper scrolling in design time?

Thank you very much.

Community
  • 1
  • 1
Dennis Alexander
  • 861
  • 1
  • 11
  • 26

2 Answers2

12

Don't think there exists an out-of-the-box design-time attribute for this. However you can create one yourself quite easily.

say something like:

using System.ComponentModel;
using System.Windows;
using System.Windows.Controls;

public static class CustomDesignAttributes {
  private static bool? _isInDesignMode;

  public static DependencyProperty VerticalScrollToProperty = DependencyProperty.RegisterAttached(
    "VerticalScrollTo",
    typeof(double),
    typeof(CustomDesignAttributes),
    new PropertyMetadata(ScrollToChanged));

  public static DependencyProperty HorizontalScrollToProperty = DependencyProperty.RegisterAttached(
    "HorizontalScrollTo",
    typeof(double),
    typeof(CustomDesignAttributes),
    new PropertyMetadata(ScrollToChanged));

  private static bool IsInDesignMode {
    get {
      if (!_isInDesignMode.HasValue) {
        var prop = DesignerProperties.IsInDesignModeProperty;
        _isInDesignMode =
          (bool)DependencyPropertyDescriptor.FromProperty(prop, typeof(FrameworkElement)).Metadata.DefaultValue;
      }

      return _isInDesignMode.Value;
    }
  }

  public static void SetVerticalScrollTo(UIElement element, double value) {
    element.SetValue(VerticalScrollToProperty, value);
  }

  public static double GetVerticalScrollTo(UIElement element) {
    return (double)element.GetValue(VerticalScrollToProperty);
  }

  public static void SetHorizontalScrollTo(UIElement element, double value) {
    element.SetValue(HorizontalScrollToProperty, value);
  }

  public static double GetHorizontalTo(UIElement element) {
    return (double)element.GetValue(HorizontalScrollToProperty);
  }

  private static void ScrollToChanged(DependencyObject d, DependencyPropertyChangedEventArgs e) {
    if (!IsInDesignMode)
      return;
    ScrollViewer viewer = d as ScrollViewer;
    if (viewer == null)
      return;
    if (e.Property == VerticalScrollToProperty) {
      viewer.ScrollToVerticalOffset((double)e.NewValue);
    } else if (e.Property == HorizontalScrollToProperty) {
      viewer.ScrollToHorizontalOffset((double)e.NewValue);
    }
  }
}

Now by setting the custom attached property in your xaml such as:

<ScrollViewer Height="200"
              local:CustomDesignAttributes.VerticalScrollTo="50">
...

In design time alone you should be able to view your design with a scroll offset like

enter image description here

while in actual run-time the control will be un-touched. The CustomDesignAttributes also has a similar property local:CustomDesignAttributes.HorizontalScrollTo for Horizontal offset at design-time.

Viv
  • 17,170
  • 4
  • 51
  • 71
  • Thank you for your detailed and working answer, Viv. I've managed to get it working. Never the less, it's confusing why Microsoft dropped the support. Windows Forms Applications with scrolling panels does support scrolling in design mode if I remember correctly. – Dennis Alexander Jul 03 '13 at 12:16
  • I wonder if it's possible to do the same thing in Silverlight? I tried your code in Silverlight project and it throws `The name 'DependencyPropertyDescriptor' does not exist in the current context` error. Is there any workaround? I found this article https://bkiener.wordpress.com/2010/08/27/listening-to-dependencyproperty-changes-in-silverlight/ which touches the topic, but can't figure out how apply it for your code. – Dimitry K Feb 08 '15 at 09:26
2

There's another approach to solve problem of non-scrolling ScrollViewer. Basically make the contents of your ScrollViewer into a UserControl. And then you will be editing your actual contents as you would edit your UserControl (separate file and full width).

It is described in more details at this blog article http://electricbeach.org/?p=862

Dimitry K
  • 2,236
  • 1
  • 28
  • 37
  • Is there a details for Visual Studio? I'm stuck at step 4 –  Aug 28 '17 at 13:56
  • @prouser135 well, I am not 100% sure. As GUI editor in VS is a bit different than in Blend. But you may still be lucky ... – Dimitry K Aug 28 '17 at 14:19