Phonegap android application div bg image - android

I am very new to android application and I made a simple android application using Phonegap.
I created some pages and linked correctly, Its working fine and I would likes to add page transitions as in many applications.
Please help me how to add those transitions. i.e. When a user clicks in the link and this page will slide left and has to show the upcoming page.

Use
$.mobile.changePage('#pageid', {
transition : "none",
reverse : true,
changeHash : true
});
to change page. define desired transition here

I think you can either use any jQuery slide transition or the best way is to use the MobileJquery Framework
in which you will have a lot of options to customize. Click here for more details www.jquerymobile.com

Related

Push and pop in react native

I am new in react native , i have create several screens in react native. but i am facing problem in navigating between pages.
We have to manage the stack and stack index with own ??
Without defining the Route in Apps.js can we navigate to other pages ??
I followed these tutorials but didn't get simple ways to navigate through pages .
https://facebook.github.io/react-native/docs/navigation.html
https://reactnavigation.org/docs/intro/
As in ios we write
Jump to new pages :
[self.navigationController pushViewController:vc animated:YES];
Back to previous pages :
[self.navigationController popViewController animated:YES];
(pushing controller to stack and pop controller from stack is managed by UINavigationController it self )
My Question is :
1.What is the easiest or Proper way to implement the navigation in react native ?.
How can we Set Animated property like in ios ?
Please help me , thanks in advance :)
The most popular way of implementing navigation is by using React-Navigation.
You need to explain how is it in iOS. If you need to perform animation on the component, screen or navigaiton, you use Animated library or Layout Animation of React-Native.

WebView vs Chrome Custom Tab

I am building an app where in a Detail Activity I have to show a web page.
I was going to use WebView, but then I saw Chrome Custom Tab.
What do you guys think it's better to implement and why?
If you just want to show a certain page then I would suggest you use chrome custom tabs. You can style the toolbar in a way it resembles your app style and they are intended for showing content without you having to worry much about anything else.
if you want to have full control over what the user is doing inside this website you have to use a webview. (you can prevent the user clicking links on the webview, you could intercept data the user inputs into controls on the website...)
But this can also be a negative aspect since the user really has to trust you that you don't log his data or even fiddle with it.
summary: "The WebView is good solution if you are hosting your own content inside your app. If your app directs people to URLs outside your domain, we recommend that you use Chrome Custom Tabs"
-> If it isn't your website you probably should go with custom tabs.
https://developer.chrome.com/multidevice/android/customtabs#whentouse
Webview : If you want your own content which has click listeners and data interception you need to go to webview. But It wont share the state with the browser.
Chrome Custom tab : If You are just redirecting to a url, i prefer chrome custom tab. But it has little cons too. We wont change its title text color where we can change the titlebar color. The text color will be chosen by the theme color only. And We can add actions, but we cant change the overflow menu icon or the entire actions displayed in the overflow action.
Even though the limitation are not a big deal. I recommend chrome custom tab over webview.

android : Customize dropdown's radiobutton open from webview

I am developing android application which is based on the webview.
The page loaded in the WebView has dropdown. When I click on the drop down, a dialog appears(it is the native Android dialog).i want to apply my them for that dropdown dialog item. i have searched but solution not found for that.
FYI, I have implemented it in the native activity but not able to implement it in webview.I want dropdown alert like displayed in below image.
Please help me, if anyone knows related to this issue.
You need to understand the concept of a Webview. It is just like a browser which you are loading inside your activity. Your other activities in the app can not interact with the webview. If you want to change the style of your dropdown for android's webview, use Media Queries in your website which will change the view of your website when loaded for smaller devices

Android : How can I implement user manual or app instruction on start up of app

I am new to Android development, I need to show user manual like Flip-kart app on start-up of app.
Please refer the image below, You will get an idea about, What actually I want to achieve....
Is there any standard way to achieve this?
You can do the whole stuff manually.
Or use a prebuilt library called ShowcaseView.
You'll find details, code and guide here http://www.xda-developers.com/android/create-holo-themed-demo-overlays-with-showcaseview/
Here is my suggestion
Get the semi-transparent images of manual pages. Keep the Images in your res/drawable.
Use sharedpreference to maintain the status whether this manual is shown to user on startup or not (Depending on your requirement). Check the status when the app is launched, to decide whether to show this to user or bypass it.
Use a fragment or Activity to display this manual images in sequence one after another.
for this you can use viewpager, swipe animation or simple buttons.
just use one Gallery view and skip button on it.Show that gallery on the first installation.For that you can set flag value in sharedpreference.Also shows a button for virtrual tour in Left drawer,

History back navigation using ng-include

I started to develop a single page web app with angularjs and now I'm defining the navigation. So, I end up using 2 levels of navigation:
1st level: Main navigation using ng-view.
2nd level: SubView navigation with the top and bottom bars using ng-include.
This is our iphone scenario:
The iphone scenario seems ok for me because we control all navigation with our buttons.
But, now lets think in android scenario where the user can use the history back button(physical button) to navigate back. How can we support it if we use ng-include for the subnavigation?
Thanks in advance
You could add a parameter to your URL to make it work with Android history.
#/main?page=1
#/main?page=2
Then use that to control the state of your app, and then android back button will work.
You can set url parameters with $location.search:
$location.search('page', 4);
$location.search docs: http://docs.angularjs.org/api/ng.$location#search
And one more thing: You'll want to add reloadOnSearch: false option to your $routeProvider.when() declaration for your view. By default, the whole view reloads when you change a query parameter with $location.search(). Setting that to false will make it not reload, which is what you want in this case:
$routeProvider.when('/main', { reloadOnSearch: false });
reloadOnSearch docs: http://docs.angularjs.org/api/ng.$routeProvider#when

Categories

Resources