I would like to recreate the transition effect which can be observed when a user clicks on a tile on the start menu. But I have hit a road block in my quest. I am unable to search for information related to that particular transition. Is it possible to do so in you own application? If so, please guide me. Thanks in advance.
I call it a 'peel animation' and have implemented it here:
http://www.scottlogic.co.uk/blog/colin/2011/03/metro-in-motion-part-2-peel-animations/
Others call it a 'turnstile' and have also implemented it:
http://turnstile.codeplex.com/
Related
I'm here because my research and testing lead me nowhere.
I have made a little calendar application and now I want to improve the user interface with nice controls. I'm trying to achieve an interface where you can create an event by dragging over it (as you can do in Google agenda, in fact this a school project and I want to reproduce this week view).
For this purpose I have tried this approach:
For each cells of the area (a GridPane that contain VBoxes) I attach handlers that achieve that feature (setOnDragDetected, setOnMouseDragEntered and setOnMouseDragReleased). And it does the job well but in some case this don't work (if the mouse move over another event, which do no have the handlers, the drag feature stop).
As I saw this too heavy and subject to bogus (3 handlers x 7 columns x 48 rows = 1008 handlers !! ), I thought about other approach but I'm a beginner in javaFX and I don't know if there is other mechanism to perform this. (I thought about a transparent layout/pane that will handle this feature and act like a "touch screen" over my application but I did not found satisfying answers). Can someone enlighten me about this kind of problem ? For a good example of what I try to achieve take the behaviour of the Google agenda for an event creation with the mouse (I do not need to manage overlap of event). Thanks in advance !!
I post a picture of what the actual view look like.
So as Tomas Mikula suggest me I only attached my handlers to the GridPane (and not to each "cell" as I made previously): setOnDragDetected, setOnMouseDragOver, setOnMouseDragReleased and setOnMouseDragExited.
As the handlers are triggered on the GridPane, moving the mouse over other element doesn't stop the feature.
With this I reduced the number of handler, simplified the code (As I do not need to manage extra behaviours as mover over another child).
Thanks !
when i use pivot with in the panorama .pivot are used as a gallery view. i want to move pivot when i swipe it .but the problem is this because of both panorama and pivot are the same gesture event so both are they move .
i want swipe only my pivot view .
I would like some sample code or any other suggestion to do this.
so please give me a solution for doing this and
also give me a link where i easily understand this. Thanx in advance
You shouldn't have a Pivot in a Panorama control. End of discussion.
I believe it is achievable, because I've already solved similar issues with having WebBrowser control inside a custom horizontal-scrollable overview container like Pivot/Panorama, but believe me, it is NOT worth it. I've had to dig very deep into the visualstructure of the controls and attach my own manipulation-handlers to their viscera, manually choose which horiz/verti events to pass and which to cancel, and so on. This is not so easy, takes a lot of time, and doesn't guarantee that on the end you will have something behaving in a way you wanted to achieve in the first place. If you are not bound by some contract to preserve the shape of the UI, please, drop the idea and redesign your UI, just to save on your sanity and nerves.
But, if you are already insane or really want to dig where noone should, start on analysing your UI as a two rectangles: large pano and small pivo, and think which part should behave how on different possible touches/h-v swipes/h-v pans/pinches/so on. Write it down just to for reference, or soon you will probably start making small mistakes that will interfere with your understaning of the flow of the events.
I've checked the version I have, and "my" Panorama uses internally the UIElement.ManipulationXXXX events. In that case:
Display visualtrees of your UI and try attaching manipulation-events to every control. In those events, write/log which control's which handler was invoked. Then make some swipe/scroll on your APP and observe events. Analyze how they were bubbling and try cancelling (e.Handled=true) the manipulation-completed and/or manipulation-delta events somewhere between pivot and panorama. Your goal is to have the panorama see that e.Handled=true, while your pivot must see e.Handled=false. Your Pivot will probably see the event sooner than the Pano, so that point should be relatively easy.
If it fails to work, then you should check your version of the Pano, and check how it detects movements. If, for example, it uses the GestureListener - try the same trick with it. Etc.
And remember, you can always make your own horizontal-overwiew-container that will look like Pano, behave like Pano, and that will work with Pivo better - because it will be your code and you will tell it what and when to move. if you want to go this way, start on google and check all the preliminary Panorama previews that random people have published before that control was published by MS.
On my site I have a number of Google Maps (v3) that you can select via a TabPanel (one per tab) but there is a problem when you switch tabs. When you select the tab it does not "wake up" the map. To fix this I simply need to use ResizeEvent.fire(source, Window.getClientWidth(), Window.getClientHight()); this will active the resize listener on the map and "wake it up." My problem is that I cant get a pointer to the registered resize handlers for the browser window (it is package protected in com.google.gwt.user.client.Window.handlers) therefore I don't know what to use as my source. If anyone has the answer to my solution or another possible solution it would be greatly appreciated.
Thanks, Tom
I am not sure if using resize is the best way of doing this (I haven't embedded a map before), but you could consider using a TabLayoutPanel instead of a TabPanel, and call panel.onResize() instead of firing the resize event. Note that you would need to use *LayoutPanels (or something that implements ProvidesResize) all the way to the root of the document, and your page would need to be rendered in standards mode.
Thanks for your reply but I figured out that these three lines:
HasLatLng center = mapWidget.getMap().getCenter();
Event.trigger(mapWidget.getMap(), "resize");
mapWidget.getMap().setCenter(center);
do the trick. This is basically what happens when the map loads initially. In the onLoad() method for MapWidget it makes a call to super.onLoad() then executes these three lines which "wakes up" the map and preserves the center point.
If you are using GWT-Maps-V3-Api, there is a triggerResize() function in the MapWidget class that does the trick.
I'm wondering how I can give the focus back to the window that it before my window got it. I've looked around and so far only seen functions to get, not release, focus.
I wonder if you just need the focus released, or do you need to focus on another entity instead, after releasing the focus from said entity?
If you need to know previous widget in your form tab order, take a look at QWidget::nextInFocusChain and QWidget::previousInFocusChain. You should be able to get next\previous widget in your widget's focus chain. Once you know it, you can pass focus to it.
If you're looking to get next\previous window in Z-order take a look at winapi GetNextWindow function (GW_HWNDPREV in wCmd parameter will return a handle to the window above the given window). Once you know the previous window you can bring it back to from using BringWindowToTop
hope this helps, regards
Is there any way to control the threshold of the flick action to on/off a toggle switch so that it doesn't mess with the pivot control's navigation?
Sorry, but I'm going to avoid you're question (I can't answer it anyway) and suggest you use a different approach.
You could (I assume) use a checkbox to just as easily provide the option to the person using the application. Afterall a toggle switch has the same functionality as a checkbox (specify/choose between two states) it just implements the interaction differently.
The toggle switch has not been designed/built (AFAIK) to support being used on top of something which also supports the same gesture.
As a general rule of usability, having controls on top of each other (or even next to each other) which support the same gesture is likely to cause problems for the user. Even if the problems are through accidentaly triggering the wrong gesture or expectations about how their gesture will be interpretted.
In summary: this is a really tricky problem to solve; I don't think you can with the controls as they are; and the problem goes away entirely if you use a different control for toggling anyway.
I've had the same problem with my codermate, we've been digging this for many hours and we finally reached the top of the hill and we came up with a solution.
This solution works for the bing map control:
on mouse enter: myMapControl.CaptureMouse();
on mouse leave: myMapControl.ReleaseMouseCapture();
And there you go, when you'll navigate inside the map the pivot won't do transition ;)
If you don't get the point, just poke me and I'm going to explain with real code (I'm quite busy right now).
Cheers
This solution posted recently seems to be working out for people for dealing with gesture conflicts on pano / pivot. You might like to check it out.
Preventing the Pivot or Panorama controls from scrolling
Set the IsHitTestVisible = false in your root pivot control
The solution to this is simple, and comes from my experience with Android and iPhone application development.
simply make sure you only tap into the OnMouseLeave event - not the OnChecked or the OnMouseClick as these will accidentally fire just by touching the toggle.
You want make sure that they were touching it when they let go of the screen, and this (unless you put the toggle on the edge of the screen will almost never be the case