Activity navigation: custom animation with popEnter and popExit like fragments - android-activity

Changing activities with an animation is possible using the code below:
Bundle animation = ActivityOptions.makeCustomAnimation(App.getContext(), R.anim.enter_from_right, R.anim.exit_to_left).toBundle();
startActivity(intent, animation);
For fragments you can do something similar on FragmentTransaction:
// ...
transaction.setCustomAnimations(R.anim.enter_from_right, R.anim.exit_to_left);
// ...
This works!
But I'd like to have an animation when pressing back (pop from backstack).
For fragments you simply add 2 anim resources (popEnter & popExit):
transaction.setCustomAnimations(R.anim.enter_from_right, R.anim.exit_to_left, R.anim.enter_from_left, R.anim.exit_to_right);
How can I create the same 'back-animation' for activities?

I've found a different though simple approach that seems to work quite well. Animations for activities can also be performed using overridePendingTransition, so when the activity finishes you'll simply use that method.
It would be most effective to implement these overrides in a BaseActivity, which is extended by all activities in your project. Now all your activities will automatically include an exit animation and an animation when starting new activities:
public abstract class BaseActivity extends AppCompatActivity {
#Override
public void finish() {
super.finish();
onLeaveThisActivity();
}
protected void onLeaveThisActivity() {
overridePendingTransition(R.anim.enter_from_left, R.anim.exit_to_right);
}
// It's cleaner to animate the start of new activities the same way.
// Override startActivity(), and call *overridePendingTransition*
// right after the super, so every single activity transaction will be animated:
#Override
public void startActivity(Intent intent) {
super.startActivity(intent);
onStartNewActivity();
}
#Override
public void startActivity(Intent intent, Bundle options) {
super.startActivity(intent, options);
onStartNewActivity();
}
#Override
public void startActivityForResult(Intent intent, int requestCode) {
super.startActivityForResult(intent, requestCode);
onStartNewActivity();
}
#Override
public void startActivityForResult(Intent intent, int requestCode, Bundle options) {
super.startActivityForResult(intent, requestCode, options);
onStartNewActivity();
}
protected void onStartNewActivity() {
overridePendingTransition(R.anim.enter_from_right, R.anim.exit_to_left);
}
}
To round things up, I'll include the 4 anim resources:
enter_from_right
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="500"
android:fromXDelta="100%p"
android:toXDelta="0%p"/>
exit_to_left
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="500"
android:fromXDelta="0%p"
android:toXDelta="-100%p"/>
enter_from_left
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="500"
android:fromXDelta="-100%p"
android:toXDelta="0%p"/>
exit_to_right
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="500"
android:fromXDelta="0%p"
android:toXDelta="100%p"/>
ps. You'd probably like to exclude the exit-animation in your starting / main activity ;-)
public class MainMenuActivity extends BaseActivity {
....
#Override
protected void onLeaveThisActivity() {
// Don't use an exit animation when leaving the main activity!
}
}
EDIT Oct 24 2019:
When navigating from one activity to the next, AND finishing the current activity in the process, take note that finish() should be called BEFORE the navigation implementation. If this is done in the wrong order, onLeaveThisActivity will be called AFTER onStartNewActivity, resulting in the wrong animation.

Related

GWT / GWTBootstrap3 Extending Tooltip: Exception with addHandler in C'tor

I created the following class as an extension of gwtbootstrap3 Tooltip. There are at least 2 reasons why I want to derive the gwtbootstrap3 Tooltip class:
1.) Add a onWindowClosing Handler when the tooltip is shown so I can hide() the tooltip when the user leaves the page (this is - as far as I understand - a feature which is also not supported in Bootstrap, is it?)
2.) I want to prevent Tooltips from being shown when the page is displayed on iPads or iPhones as they behave strange when tooltips are involved (first tip shows the tooltip , the second tip executes the button, which is not exactly what the user expects)
Please note that the class given below is still not finished ... but already at this stage I get an exception when adding a handler.
Please also note that it throws an exception no matter what type of Handler (ShowHandler, ShownHandler, etc.) I add.
Any help greatly appreciated.
package com.mypackage.client.widgets.featureWidgets;
import org.gwtbootstrap3.client.shared.event.ShowEvent;
import org.gwtbootstrap3.client.shared.event.ShowHandler;
import org.gwtbootstrap3.client.ui.constants.Trigger;
import com.google.gwt.event.shared.HandlerRegistration;
import com.google.gwt.user.client.Window;
import com.google.gwt.user.client.Window.ClosingEvent;
public class Tooltip extends org.gwtbootstrap3.client.ui.Tooltip {
private boolean isMobile;
private HandlerRegistration windowClosingHandlerRegistration;
private final Tooltip tooltip;
public Tooltip() {
super();
tooltip = this;
this.addShowHandler(new ShowHandler() {
#Override
public void onShow(final ShowEvent showEvent) {
// TODO Auto-generated method stub
if (windowClosingHandlerRegistration == null) {
windowClosingHandlerRegistration = Window.addWindowClosingHandler(new Window.ClosingHandler() {
#Override
public void onWindowClosing(final ClosingEvent arg0) {
tooltip.hide();
}
});
}
}
});
}
}
When I create a instance of this tooltip using the following:
[...]
<b:ButtonToolBar ui:field="itemButtonToolBar" addStyleNames="hiddenPrint">
<b:ButtonGroup>
<a:Tooltip title="{msgs.buttomTitleAddItem}" container="body">
<b:Button ui:field="addItemButton" icon="PLUS"/>
</a:Tooltip>
[...]
I get the following exception when trying to add the Handler, why?
SEVERE: (TypeError) : Cannot read property 'addHandler_11_g$' of undefinedcom.google.gwt.core.client.JavaScriptException: (TypeError) : Cannot read property 'addHandler_11_g$' of undefined
at Unknown.addShowHandler_2_g$(meetingApp-0.js#26:57195)
at Unknown.Tooltip_6_g$(meetingApp-0.js#8:57685)
at Unknown.build_f_Tooltip2_0_g$(meetingApp-0.js#55:31606)
at Unknown.get_f_Tooltip2_0_g$(meetingApp-0.js#15:31831)
at Unknown.build_f_ButtonGroup1_0_g$(meetingApp-0.js#38:31524)
at Unknown.get_f_ButtonGroup1_0_g$(meetingApp-0.js#15:31791)
at Unknown.build_itemButtonToolBar_0_g$(meetingApp-0.js#41:31696)
at Unknown.get_itemButtonToolBar_0_g$(meetingApp-0.js#15:31876)
at Unknown.createAndBindUi_58_g$(meetingApp-0.js#91:31437)
at Unknown.createAndBindUi_59_g$(meetingApp-0.js#15:31441)
at Unknown.ItemButtonGroup_2_g$(meetingApp-0.js#56:30733)
at Unknown.$init_589_g$(meetingApp-0.js#31:37722)
at Unknown.SummaryWidget_1_g$(meetingApp-0.js#8:37686)
at Unknown.loadSummaryWidget_0_g$(meetingApp-0.js#26:4991)
at Unknown.setSummary_1_g$(meetingApp-0.js#10:5028)
at Unknown.onSuccess_8_g$(meetingApp-0.js#21:3312)
at Unknown.onSuccess_9_g$(meetingApp-0.js#8:3317)
at Unknown.onResponseReceived_0_g$(meetingApp-0.js#26:156917)
at Unknown.fireOnResponseReceived_0_g$(meetingApp-0.js#17:129224)
at Unknown.onReadyStateChange_0_g$(meetingApp-0.js#28:129532)
at Unknown.<anonymous>(meetingApp-0.js#18:172082)
at Unknown.apply_0_g$(meetingApp-0.js#28:104636)
at Unknown.entry0_0_g$(meetingApp-0.js#16:104692)
at Unknown.<anonymous>(meetingApp-0.js#14:104672)
Disclaimer: I use gwtbootstrap3 v0.9.2 and I believe it's the same version as you use as I got the same error for your code.
A Tooltip needs a Widget to operate on (in your case the Button is a Tooltip's widget). Tooltip uses it's widget to do all events handling - see source code for addShowHandler for example.
Now you need to understand how the whole structure is built:
first the Tooltip is created (wit no widget set)
then the Button is created
Tooltip's setWidget method is called to set the button as a widget
So when you use addShowHandler method in your constructor, you actually call widget.addHandler while widget is null.
You can check it by Window.alert(tooltip.getWidget() == null ? "null" : tooltip.getWidget().toString());
There are few ways to make it work (the later the better):
wait for DOM structure to be built by scheduling a deferred command (if you are sure that the widget will be eventually set):
Scheduler.get().scheduleDeferred(new ScheduledCommand() {
#Override
public void execute() {
// set up events handling
}
});
override setWidget method (note thet there are two methods: setWidget(Widget w) and setWidget(IsWidget w)):
#Override
public void setWidget(Widget w) {
super.setWidget(w);
// set up events handling
}
you don't need to addWindowClosingHandler in the showEvent handler, you can do it directly in the constructor:
public class Tooltip extends org.gwtbootstrap3.client.ui.Tooltip {
private boolean isMobile;
private final Tooltip tooltip;
public Tooltip() {
super();
tooltip = this;
Window.addWindowClosingHandler(new Window.ClosingHandler() {
#Override
public void onWindowClosing(final ClosingEvent arg0) {
tooltip.hide();
}
});
}
}

SwipeRefreshLayout error

I am trying to implement swiperefreshlayout and I am getting error at "this"
public class viewBets_activity extends ActionBarActivity {
SwipeRefreshLayout swipeLayout;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.viewbets);
swipeLayout = (SwipeRefreshLayout) findViewById(R.id.swipe_container);
swipeLayout.setOnRefreshListener(this);
swipeLayout.setColorScheme(android.R.color.holo_blue_bright,
android.R.color.holo_green_light,
android.R.color.holo_orange_light,
android.R.color.holo_red_light);
}
public void onRefresh() {
new Handler().postDelayed(new Runnable() {
#Override
public void run() {
swipeLayout.setRefreshing(false);
}
}, 5000);
}
}
I am getting error at swipeLayout.setOnRefreshListener(this); screenshot below
Well, now that you added the screenshot, the error is clear.
You're passing the wrong argument into setOnRefreshListener()! And of course, this makes sense, if you think about it. Your class is a ActionBarActivity. You're trying to set the OnRefreshListener as an ActionBarActivity...doesn't make any sense! You need to change your code to this:
swipeLayout.setOnRefreshListener(new OnRefreshListener()
{
#Override
public void onRefresh()
{
// what you want to happen onRefresh goes here
}
});
Here, you're creating a new OnRefreshListener object which you're adding as the listener.
For the future, in general, any time you have a setOn______Listener() method, the argument you'll be passing will be a On_____Listener object that you've customized. You can either created separately, or create it right in the set method the way I did in my answer.
Your class is missing
implement SwipeRefreshLayout.OnRefreshListener
This allows the listener to refer to the overridden method onRefresh when passing through this as the argument for setOnRefreshListener

GWT - run command exactly once per event loop

I'm writing some wrapper classes around zurb foundation.
Foundation widgets need an init() function to be called after the elements have been added to the DOM.
I can accomplish this easily enough with this method:
public static void initWidgets() {
Scheduler.get().scheduleDeferred(new Scheduler.ScheduledCommand() {
#Override
public void execute() {
foundationInit();
}
});
}
...where foundationInit() is a JSNI call to the foundation init() function. I then add a call to initWidgets() in the constructor of any foundation element. So far so good.
However, if multiple foundation widgets are added to the DOM during a particular event loop, then the init() method will be called multiple times. Foundation doesn't actually care about this, but it would be nice to find a way around this.
Is there any scheduler functionality / pattern that'd allow me to schedule a particular command to run only once, no matter how many times the schedule method is called with that command?
Something like: scheduleDeferredIfNotAlreadyScheduled(Command c)
I don't know how to get a handle on the event loop, so I don't know how to reset a flag that'd tell me whether or not to add the command or not.
I don't know any Scheduller command to do that, but it could be done with a static boolean variable, e.g.:
private static boolean initialized;
public static void initWidgets() {
initialized = false;
Scheduler.get().scheduleDeferred(new Scheduler.ScheduledCommand() {
#Override
public void execute() {
if (!initialized) {
initialized = true;
foundationInit();
}
}
});
}
In such case I usually use Guava's Supplier.double checked locking is really safe.
public static Supplier<Boolean> supplier=Suppliers.memoize(new Supplier<Boolean>() {
#Override
public Boolean get() {
foundationInit();
return true;
}
});
public static void initWidgets() {
Scheduler.get().scheduleDeferred(new Scheduler.ScheduledCommand() {
#Override
public void execute() {
boolean initialized=supplier.get();
}
});
}

Update Activity's UI when it is not visible [Another activity is in foreground]

Is it ok to update an Activity when it is not in the foreground. I am not asking if it can be done from a background thread.
Consider this:
I have two activities Activity-A and Activity-B.
I start an AsyncTask from Activity-A and then go to Activity-B. Now after sometime, the AsyncTask finishes and in the onPostExecute() method, I try to update the images that are in Activity-A. All this is happening when Activity-B is in the foreground.
Is the above scenario reasonable or do I have to wait till Activity-A is in the foreground to update its UI?
If I can safely update the UI in the above scenario, what should I do when Activity-A is killed or finished and the AsyncTask still completes and tries to update the UI? [Assuming I have to do a check for isFinishing before updating the UI]
The above is a simplified version of what I am trying to do. I actually have a Custom ImageView that loads images from the server and updates itself when the request is done. So I am wondering what scenarios I have to worry about if the view is updating itself when the activity is not in foreground or has finished/destroyed.
EDIT:
Here is a sample that is working.
public class MainActivity extends Activity implements OnClickListener {
ImageView mImageView;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mImageView = (ImageView) findViewById(R.id.iv_image);
findViewById(R.id.btn_activity_2).setOnClickListener(this);
}
#Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.btn_activity_2:
new BackGroundTask().execute();
startActivity(new Intent(MainActivity.this, Activity2.class));
break;
}
}
private class BackGroundTask extends AsyncTask<Void, Void, Void> {
#Override
protected Void doInBackground(Void... params) {
try {
Thread.sleep(5000);
} catch (InterruptedException e) {
e.printStackTrace();
}
return null;
}
#Override
protected void onPostExecute(Void result) {
super.onPostExecute(result);
mImageView.setImageResource(R.drawable.ic_launcher);
}
}
}
The Layout is just a LinearLayout with button and image.
No, it's not. You can't update a UI that's not visible :) Activity A is onPause (or Stopped if needed).
You have to implement a reasonable Activity LIfeCycle so ActivityA can update its UI during onResume(); The AsyncTask should only touch the data that the UI needs to draw itself.
Your "Custom IMage View" has to be able to load the image from a place outside the Activity.
If your CustomImageView is (or can pass as a regular ImageView), you can use something like Picasso to offload the Bitmap handling the correct way.

Drag and Drop in GWT using gwt dnd

I have been really struggling to get Drag and Drop working in GWT. Last 3 days, I was trying to create a basic drag and drop application and failed. Currently I can drag it around, but I am unable to drop to any location.
How can we solve it? Do we need to modify onDragEnd - I am under the impression that unless I specifically have to do something, I dont have to? I am quite confused.
Also, how do I limit the drop to any single area? I do understand that we can do it using DropController. But I have defined the panels using UiBinder, so how do I get that panel back to link in the DropController? i.e. RootPanel.get() gives me the basic root panel and not the actual panel I want. I tried RootPanel.get("field-id"), but that is showing null even if that id is available. What am I doing wrong?
The code I have written is as follows:
public class TestPanel extends Composite implements
DragHandler, HasMouseDownHandlers, HasMouseUpHandlers, HasMouseMoveHandlers, HasMouseOutHandlers {
interface Binder extends UiBinder<Widget, TestPanel> { }
private static final Binder binder = GWT.create(Binder.class);
#UiField AbsolutePanel absolutePanel;
private PickupDragController TestDragController;
private Image img = new Image("./testicon.png");
public TestPanel(){
initWidget(binder.createAndBindUi(this));
absolutePanel.add(img);
TestDragController = new PickupDragController(RootPanel.get(), false);
AbsolutePositionDropController dropController = new AbsolutePositionDropController(
RootPanel.get());
TestDragController.registerDropController(dropController);
TestDragController.addDragHandler(this);
TestDragController.makeDraggable(this, getDragHandle());
}
private Widget getDragHandle() {
return img;
}
#Override
public void onDragEnd(DragEndEvent event) { }
#Override
public void onDragStart(DragStartEvent event) { }
#Override
public void onPreviewDragEnd(DragEndEvent event) throws VetoDragException { }
#Override
public void onPreviewDragStart(DragStartEvent event) throws VetoDragException { }
#Override
public HandlerRegistration addMouseDownHandler(MouseDownHandler handler) {
return addDomHandler(handler, MouseDownEvent.getType());
}
#Override
public HandlerRegistration addMouseUpHandler(MouseUpHandler handler) {
return addDomHandler(handler, MouseUpEvent.getType());
}
#Override
public HandlerRegistration addMouseMoveHandler(MouseMoveHandler handler) {
return addDomHandler(handler, MouseMoveEvent.getType());
}
#Override
public HandlerRegistration addMouseOutHandler(MouseOutHandler handler) {
return addDomHandler(handler, MouseOutEvent.getType());
}
}
and the testpanel uibinder looks like the following:
<g:AbsolutePanel ui:field="absolutePanel" styleName="{style.panel}">
</g:AbsolutePanel>
If somebody can help me out, I will be very much obliged.
K
P.S: To explain more: I was able to solve the first question by updating onDragEnd as the following:
#Override
public void onDragEnd(DragEndEvent event) {
DragContext context = event.getContext();
RootPanel.get().add(context.draggable, context.desiredDraggableX, context.desiredDraggableY);
}
but, I am not sure whether this is the correct solution - since I think I should not be doing the positioning myself.
If you're new to GWT dnd, why don't you try the working demo ?
There is a lot of examples and all the source code is available.
(And no, you're not supposed to do the positionning yourself)
You have to add a DragOverHandler on the drop target(s): even if it does nothing, it defines the component as a drop target.
Of course, you still need to define the DropHandler too on this component (and optionally, DragEnterHandler and DragLeaveHandler for visual feedback, in general).
The DragEndHandler is called even if the target isn't reached (drag abandoned in a non-drop area), it is used to change the state of the dragged object, you might need to set a way for the DropHandler to communicate success on dropping to the DragEndHandler (shared variable, EventBus, etc.).