There's nothing in the docs about this.
I've just read a blog post on ionics website saying that it's possible to swipe to go back (like ios7) and I've seen the latest ng-conf where they talked about it as well, but nowhere to they mention on how to implement the damn thing.
No need to do a on-swipe-left. The latest version of Ionic provides this, and is defaults to true.
As for using this feature, you need to create multiple views, and then just swipe from left, it will take you back to previous view.
Ionic has built in gesture events.
Ex.
<div on-swipe-left="swipeleftAction()">
</div>
So I guess you could place on-swipe-left or on-swipe-right in your page container or div.
I have a function that handled removing an item from the array of items,
I programatically closed all options buttons by calling
$ionicListDelegate.closeOptionButtons();
Related
Before I begin, I want to mention that I've found a million answers showing how to do this from code, which involves setDisplayHomeAsUpEnabled(true) from your Activity. However, what I have not been able to find is a way how to do it from XML. (I would like to hide as much UI code in the XML files as possible).
One article I did find is this, which states
Step 3: Specifying the parent activity name in the AndroidManifest.xml adds the Back-Button arrow
and Click-action. Tapping on the back-arrow takes us to the Parent
Activity i.e Home Screen.
which doesn't work for me (the Back Button doesn't appear). I've followed all the steps in the article.
Does anyone know how to do this via xml? Is it even possible?
Yes, it's possible but still, you have to set the listener in java code. You can create a custom toolbar view and add a button to it. Then create a button in the java file and set the CilckListener.
Or You can use the default toolbar and do setDisplayHomeAsUpEnabled(true) from your Activity.
We usually make a custom toolbar, suppose you need a search bar in the toolbar then what you will do? So try to make an xml then use <include> tag in xml. You can search youtube. Follow the channel CodingInFlow, that guy explains very perfectly. If you don't understand what I am saying then understand the basics first, it will help you learn faster.
to achieve a fade transition I used a PageRouteBuilder()to build some of my routes.
I noticed however while testing the app that the back button on Android and The User gesture on IOS are not working to navigate back to previous route!
Is this the normal behavior of the PageRouteBuilder()? or am I maybe doing something wrong?
thanks a lot!
So as it turned out, in MaterialPageRoute() the PageTransitionBuilder is selected based on which platform the app is running on.
I was able to get it to work for Android by using the WillPopScope() widget, as I was using Nested Navigators.
However, on IOS for the back gesture they are using the private class _CupertinoBackGestureController and I don't think there is an easy way to achieve that at this moment!
Hope that helps whoever is facing the same thing and thanks again!
The popup to back button has nothing to do with PageRouteBuilder, but has something to do with how you are inserting the second page in the stack.
If you are using Navigator.pushNamed(context, <PageRouteBuilder>), this will keep the first page in the stack and the back button should work.
However, If you are using Navigator.pushNamedReplacement(context, <PageRouteBuilder>), it will remove the first page and push the second page to stack.
I'm currently experimenting with wrapping the page to be pushed in a GestureDetector, and then setting one of the onHorizontalDrag properties to pop the route. (I do this within the PageRouteBuilder itself, that way I can just pass in the page like normal when pushing.) This swipedetector package might replace the GestureDetector, or I might even experiment with this swipe_back_detector specifically made for custom routes made with PageRouteBuilder (see example they give).
I'm building an app to manage some users, where i have a page to list them. On each user i have some buttons to make some actions on them, like edit them or delete them.
When the delete button is pressed, i would like to have a modal to show up and ask if you really wawnt to delete the user. As i may be using this modal in other places, i thought i should make it kind of generic to receive the different messages i want to show, so i built a component for it.
I've searched through some examples, but i couldn't find one similar to mine.
I've made the template for the modal and the component to back it up, but i don't know how to show it, for example, on a button click.
Any help is appretiated :)
Thanks
EDIT: i'm trying to use bootstrap modals
use bootbox instead of making a modal from scratch. they can be perfectly used for delete confirm or alerts. I use them. http://bootboxjs.com/. It is also available for angularjs.
I've been trying to find a solution but I can't find any.
I'll use basic examples so anyone who knows ionic can understand my problem well.
ionic start myApp tabs will create a new project with tabs ready to go.
Those tabs are Dashboard, Chat and Settings.
When you go to the Chat Tab you will then select a person to view its chat content (which directs you to the Chat-Detail Page in actuallity)
I wanted to hide the ion-tabs directive when I go to the chat-detail page so I can force the user to use the Back button instead of clicking anything on the ion-tabs.
Simply put : you will have a hard time doing that. At best it will not look good, IF you succeed to hide using css (I did it, and really, it's not pretty). Basically you would need to define a variable on the parent scope, that changes when entering the chat-detail state, and bind it to ng-class directives on multiple elements (the ion-tabs to hide it, the ion-content to translate it up to cover the area where the tabs were, and add some transition to make it not too brutal).
The logical thing to do would be to have the chat-detail state not being a child of the state containing the tabs. The problem you will have, though, is that there is a huge bug going to / from tabbed state. See details here : https://github.com/driftyco/ionic/issues/2997
At the end of this discussion you can find some posts by Jason and Jerrybels (that would be me), that could lead you on the right way to do it. Basically, you will have to get rid of the ion-tabs directive, and use Ionic's CSS for tabs instead, doing all the states manipulations yourself.
Good luck !
You can use "hidden" attribute of ion-tab like this -
<ion-tab hidden={{condition}}" />
Using this we can show/hide tab.
I would like the popout to go to the left instead of the right if possible, as it's sometimes hidden by other UI elements.
No. Since it's a social plugin, the only styling you can change is what you see on the plugin configuration page.