Is it possible to add a vertical scrollbar to an OnDemandGrid?
Yes, I realize that an OnDemandGrid lets you scroll through a million records, and it will be awkward to imagine a scrollbar that lets you scroll all the way up and down through those million records, but I'd say it'll be good if there was a way to add a scrollbar at least to scroll through a reasonable subset around the visible viewport.
Never mind my question - I realized that it was actually showing the vertical scrollbar by default all this while, but it was hidden off the right of the page due to a large width on the div containing the dgrid.
Related
I have a yfiles.canvas.Control, with some nodes inside. However, the number of nodes is getting bigger, and I need to add a scrollbar in order to vertically navigate through them, despite the reduced size in height.
How can I do this? I see that a ScrollBar class exists, but I don't know how to integrate it.
yFiles for HTML comes with scrollbars built in. You can customize their visibility, but by default they will be shown as soon as the content rectangle is larger than the visible area. Maybe calling updateContentRect is all that is missing in your code?
Think I'm missing the obvious here, but I have a Bookstrap 3 navbar that works great in desktop view but as I squeeze the width and it gets to tablet size rather than collapsing into the toggle menu it's jumping the menu onto two lines:
http://www.doorsets.org.uk/
I've tried reducing the text size in the navbar via a media query but that isn't solving it.
What am I missing?
Appreciate it. Thank you.
NJ
One solution might be to change the point at which the navbar collapses, you can do this by creating a customized Bootstrap and setting the #grid-float-breakpoint to a larger number.
This variable unfortunately also influences the dt and dd inside a .dl-horizontal which might be a problem.
If you want to use a media query to reduce the font-size you can use the .navbar-default .navbar-nav > li > a selector. It however needs to become 9px at the smallest viewport size to still stay on a single row which is quite unreadable.
From the Bootstrap documentation:
Overflowing content
Since Bootstrap doesn't know how much space the content in your navbar needs, you might run into issues with content wrapping into a second row. To resolve this, you can:
Reduce the amount or width of navbar items.
Hide certain navbar items at certain screen sizes using responsive utility classes.
Change the point at which your navbar switches between collapsed and horizontal mode. Customize the #grid-float-breakpoint variable or add your own media query.
It goes on to say:
Changing the collapsed mobile navbar breakpoint
The navbar collapses into its vertical mobile view when the viewport is narrower than #grid-float-breakpoint, and expands into its horizontal non-mobile view when the viewport is at least #grid-float-breakpoint in width. Adjust this variable in the Less source to control when the navbar collapses/expands. The default value is 768px (the smallest "small" or "tablet" screen).
I'm trying to mimic the functionality of the NetFlix app, with a strip on the left that collapses on scrolling, I had to offset the tiles on the GridView a bit to the right so that they can accomodate that behavior. They seem to work alright in keyboard and scroll completely to the right (although I noticed the scrollbar suddenly grows in size when I hit the left boundaries. this totally changes when I use it on touch - I seem to have a limit on the right and the scrolling doesnt scroll past the last 100 pixels or so. how do I take care of this.
I'm assuming it is related to the bug here, but didn't seem to solve the problem with that solution there.
"Sticky scrolling" issue in WinRT XAML GridView control
Jay, I bet you solved it in the meantime. But I'll add my solution here anyway; it might save time for other fellows.
This effect - not being able to scroll to the very right end horizontally with touch - did go away when I either:
*) changed the VirtualizingStackPanel to a StackPanel
OR
*) Grouped the GridView (with VirtualizingStackPanel in the ItemsPanelTemplate) into a simple ScrollViewer
Hope that helps!
Initially I was under the impression that it uses the table row slideup/down animations while inserting/deleting new rows but I doubt if it's doing that as it does it so fluidly even with thousands of items in the list (otherwise it would take a lot of time for the deletions/insertions to work).
Am I right in my assumption that it's simply attaching a new instance of the News list at the bottom of the screen, shrinking the above one while the one at the bottom expands to fill up space?
UPDATE:
Please see this video of what I mean: http://dl.dropbox.com/u/4960327/ReederAnim.mov
I can not tell you exactly how Silvio Rizzi made this, but as you see in the playback, a list view is added behind the shown list view, and the front list view fades out (.alpha = 0.0;) while the list view behind it expands its height per row.
When you desicate it frame by frame it becomes quite clear what he does, and it is really not that advanced. But I have to admit, with the white "milky" polished interface, it looks quite neat.
In addition, you can see that while animating, the background list view only renders the top 7 entries (hopefully calculated by dividing the view height with the average height of the cells shown) making the list view quick to load. Then afterwards, he can load an extended array of cells once you start scrolling, or in a background thread starting once the animation is complete.
When I place a ListBox inside a ScrollViewer, if I do not define a Height attribute for the ListBox, it doesn't scroll (aside from bouncing up and down a bit), so elements off the screen are inaccessible. If I set the Height attribute on the ListBox to the actual height it takes up on the screen, it scrolls perfectly. If I don't get the Height exactly right, it doesn't scroll properly, e.g. I might not be able to reach the bottom elements in the list.
When placing other elements in the single column LayoutRoot Grid above and below the ScrollViewer/ListBox, I set the RowDefinition.Height="Auto" on all rows except the ScrollViewer's, which gets "*". The Grid appears to properly allocate space accordingly. Except now I don't know a priori how much space the ScrollViewer/ListBox takes up.
Part A: Why should I have to set the Height on the ListBox, doesn't its (virtual) height vary with the number of elements?
Part B: It appears I have to manually lay out the Grid row heights, then manually re-do them if a fontsize or other style change is called for. Is that the case? That approach seems bogus.
Your problems are caused because you've got a ListBox inside a ScrollViewer. Don't do this.
The Listbox contains an internal ScrollViewer and will (normally) grow to the available space.
By essentially having a ScrollViewer inside a ScrollViewer it doesn't know which one should grow to fit available space and how they should scroll relative to one another.
Let us know what you're trying to do. There is a better way to do it.