I am using md-virtual-repeat in the sidenav md-list. It's height is coming properly for the first time. When I close it and open it again it's height is becoming half. But if I resize window its height is coming properly again.
Related
I'm working on a Wizard-style application that has a panel on the right-hand side that changes size to reflect it's content (which would change to the content related to the current page). The panel consists of a ScrollViewer with a surrounding Rectangle that acts as a border. When the content within this panel is smaller than the available space given to it, the panel changes to the required size, aligned to the center of the available space. When the content within this panel is larger than the available space, the panel fills the space and the scrollbars show to scroll the content. The layout works like a charm and looks pretty good, but I want to do some animation when the content changes (as a result of the Wizard's page changing).
Basically, at the current time, changing the content within the panel instantaneously changes the width and height of the panel as required; however, it would be nice if I could make it so that the width and height change gradually (taking around half a second). The way I envision it is that the current content would fade out, then the panel would change size with the required animation, then the new content will fade in. I could figure out how to do this with a storyboard, but I just wondered if there was an existing control that does this?
I have a fixed container of 100vh x 100vw that contains 6 absolutely positioned divs that are 100vh x 100vw.
I use a dummy element that is positioned relative w/ 6 divs that are 100vh to trigger each scene.
When I resize the window, the scene's animation moves forward and backward in time. Is there a way to prevent that from happening?
The issue is that when you resize the window, the position of the scroll bar remains fixed at an absolute number of pixels. However, because your content is based on view height, the height of the document changes dynamically as you resize the window. Thus, the window scroll position as a percentage of the document body height is also changing, and this is what ScrollMagic bases progress on.
To illustrate with simplified math:
A) Given a window height of 1000px, your document height will be 6vh * 1000px = 6000px tall. If your window scroll position is 1200px, you'll be 20% of the way through the overall ScrollMagic timeline.
B) If you resize the browser to 800px tall, that changes the document height to 6hv * 800px = 4800px tall. However the window scroll position will remain at 1200px, which is now 25% of the way through the ScrollMagic timeline.
The simplest solution is probably to keep your document a fixed height.
I have an image in WPF which I would like to enlarge to a fixed width (say 800px).
The image should stretch to this width using the original aspect ratio (so not as to distort) and the height should be scaled as necessary.
If the height is not too large for the container the top of the image should show at the top of the container. The image should then slide upwards until the bottom of the image reaches the bottom of the container via an animation (so at some point the whole image has been displayed).
Links or suggestions highly appreciated
In WPF window, I have specified SizeToContent="WidthAndHeight".
I have a number of panels stacked up, of which I change the visibility (to Visible or Collapsed) as required. My window resizes itself according to the panel that I have set visible. No issues here.
My problem is with the resizing, that the window resizes with a jerk to the final size.
I want to animate this such that the resizing is smooth. And i want to do this in my XAML file.
Is there any solution for this???
P.S. - I have not set any Width or Height property in the window and I want to restrict myself from doing that.
In my Silverlight project, I have a couple canvases that all use ScaleTransforms to resize as the browser window size changes. However, if I make my browser window very small, then click the maximize button in the browser, the app stays the same size. How can I make it resize properly when the maximize button is clicked?
The canvas resizes up and down properly when I am resizing the window using the edge.
Have you tried wrapping your canvas with a Viewbox?
It turns out that the delegate for a resize event was being called after the resize happens (which makes sense); but that I had some conditionals that would prohibit it from resizing if it was already 800x600. If you resized the window quickly, it would not resize properly since it thought it was 800x600; but had in fact shrunk.
tl;dr - I did not code my resize event handler correctly.