I am working in extjs4.And I have a task there I am going to work on border layout.I want to make my border layout center region get infinite scrolled i.e. it loading child components in center region at that time my footer goes on downward direction based on child components.How can I create this with border layout? Is it possible with border layout ? I worked and searched a lot on it but not getting solution.Please give me some suggestions...
Thanks in advance..
Yes it is possible.keep config scroll:vertical for the center panel.Can you properly interpret your question,I mean what your trying to achieve.I have understood only that you want a border layout with header,center and footer region.I mean where you are facing issue?
Related
I have a page which has multiple vertical sections, each with a thermometer type control i have built, rendered on each. How do i code it so that when the page loads that the 'mercury' width, of all the sections, can grow in an animated way to fill the thermometers?
I have tried the samples provided for making the form.animateLayout(3000); but i've been unsuccessful in getting individual controls to grow their width concurrently..
FYI the thermometer is a Container, with a Table as its Layout, with a red Label placed on the container, at a specific width
outlineContainer.add(table.createConstraint().widthPercentage(90), mercuryLabel);
This is how i guarantee the thermometer mercury is at the correct width.
Thanks in advance.
You need to animate the direct parent of the growing element so something like this should work:
mercuryLabel.setWidth(0);
outlineContainer.animateLayout(1000);
Make sure you don't have revalidate, repaint or other related code that will disrupt this.
I am developing app using codename one .On login screen when toastbar gets loading container moves down.
I have attached screen shot in which i have shown exact error.
If I rotate the device or simulator it produced same effect.I used border layout and value of includeNativeBool = true
Can you please let me know how to resolve it?
Thanks in advance
I have attched screen shots of my form structure
There is no scrollability in this layout. I'm also guessing you assigned percentage heights in the table layout and some nuances might change.
Container1 should be scrollable on the y axis but that might break your entire layout because you rely on problematic behaviors of table layout so it will fit "exactly" it wasn't designed for that.
Can anyone please tell how to change the pixel position of the Tabpanel in extjs
Raj
the question is not clear, tell what you have done?
if you want to place your tab panel at center use a layout. if you are using border layout place it in center region. check http://docs.sencha.com/ext-js/4-1/#!/example/layout/border.html
I would like to animate a transition when moving content between two panels. I am getting a bit map image of a detail record and docking it as a thumbnail in the panel below. The docking area is in a footer grid and the content detail is in another grid that sits above the dock area (the dock and the main content area live in separate rows of the root layout control - another grid).
I have tried implementing this with a ScaleTransform and a TranslateTransform, simultaneously shrinking the image and moving it towards the footer control. When it moves into the footer control, it gets clipped even though the image Canvas.ZIndex property is set to a very high number. Eventually the thumnbail will need to be a child of a StackPanel that sits inside the footer grid.
Thanks for your consideration and help.
I had a similar problem (clipping) with a WPF animation I had. The problem was that the owner of the animation needed to be a parent of both containers for the animation to work (in my case I made it the actual window holding the containers).
Without any code, I can't see if that is your problem, but I thought I would throw it out there.
You can see my code where I animate moving from one container to another here:
http://wiassistant.codeplex.com/sourcecontrol/changeset/view/36638?projectName=WIAssistant#924851
(See the AnimatePaneBox method at the bottom of the file.) This may or may not be useful to you.
I've done something similar by creating a Canvas that sits over the top of both containers, using a WritableBitmap (if necessary) to create a rendering of the object that you're moving and attach it to that Canvas, animate the bitmap (translate, scale, opacity, whatever), and then pop the new object in under it at the end of the animation. It can be brittle if your controls need to be able to move or resize, but in most of my circumstances it's been a reliable hack.
I currently have a Silverlight canvas that exceeds the viewable area of the screen (I'm letting the users drag the viewable areas around to navigate). I'm trying to display a modal popup that always shows up in the middle of the viewable area, and I can't seem to find any property that tells me what currently is on the screen. Basically if the user has panned down to the bottom and clicks something that causes a modal popup to appear it is stuck at the far top of the screen.
Any ideas anyone?
Thanks
~Steve
I don't think this is possible since the visibility isn't being surfaced. Perhaps with some fun JavaScript to figure out where the panning is?
Quite true. I wound up creating a holding canvas, making that full screen, and putting everything else as a child canvas within that. The modal popup now comes up in the holding canvas.
Gabriel Guimarães one works good.
App.Current.Host.Content.ActualHeight(and ActualWidth) does bring the browser size inside. Good for calculating position. And of course you can use LayoutUpdated on your main control to double check the sizes and resize stuff if need be.