Custom App start Screen - javascript

I am trying to create a mobile app with HTML5, CSS, and JavaScript and want to use Phonegap Build for compiling it for the mobile devices.
So most mobile apps in an App Store have custom start Screen when you start the app it shows you at the beginning the Company logo or game logo. So how is it possible to do it with HTML5, CSS, and JavaScript.
I already searching use the search engines with may keyword combine with Phonegap or Titanium to get an example or an idea how to do that.
But nothing, so many maybe you could give me any advice.

The documentation for the splashscreen is in the link below. Not used phonegap build but I assume you configure it in the same way.
It is done by an image rather than html & css.
http://docs.phonegap.com/en/3.5.0/config_ref_images.md.html

Related

How to get rid of windows title bar in Cordova app

I want to disable or remove the title bar in my app. Something like native windows apps having their own customized title bar and minimize and maximize buttons.
Can I do this using JavaScript or any other scripting language in Cordova app?
Please keep in mind that I'm working in Cordova app JavaScript. Can I do this in Cordova app?
Please help me.
Thanks
Image of what I want to achieve
No, you can't do this. You can expand the client area to blend in with the title bar and you can even customize the title bar, but you cannot get rid of it.

Horizontal Orientation not working with Ionic and JavaScript

I am trying to lock my screen orientation to horizontal view for the whole app always. I added a config.xml line that reads
but it doesn't have any affect when I test it. Does this need to be in a certain place in the xml, before or after other things? Also, I am testing using the Ionic lab view in the browser and the Ionic view app on my phone, could either of these not implement the xml?
Further more, I have also tried the cordova screen orientation plugin with no luck. Is this also because Ionic view app doesn't use the plug in for some reason? I end up with a white screen if I try my app with the plugin and Ionic view app. The code for that is just: screen.lockOrientation('landscape');
So finally, to sum up the questions:
config.xml doesn't work with the preference stated above, why?
Is Ionic view app not supporting my code fully? (ie. do they implement the app weird from there end)
in AndroidManifest.xml, declare your Activity like so: <activity ... android:screenOrientation="landscape" .../>

How to make UI in PhoneGap, jQuery Mobile good?

I'm new to PhoneGap. I created a sample application using ponegap and jquery mobile which contain some button and few other form elements. While I installed in my mobile(Samsung Ace), i feel the UI of button and few other form elements are not looking good. Cornering in button is not perfect.
I'm using the following
cordova-2.9.0.jar
jquery-2.0.3.min.js
jquery.mobile-1.3.2.min.js
jquery.mobile-1.3.2.min.css
Am i missing anything? Please help me.How to make the UI look and feel good?
Thanks
To make UI in Phonegap, jQuery Mobile is good, but not the best. If You want the best result in performance and UI then you'll have to use Sencha Touch. Please visit this Link it may be helpful to you.
I would suggest to use ThemeRoller to get your UI in jQuerymobile framework
Check the following link
http://jquerymobile.com/themeroller/index.php
Speaking for myself, I've used jQuery Mobile with Phonegap, and I'm fairly happy with it. I don't think the problem you're having with the corners is jquery mobile, but rather related to whatever emulator program you're using; they work fine for me on various resolutions on my laptop, tablet, s3 & iphone, even when I zoom out/in between 25% and 500% on chrome using ripple.
To make a nicer interface, you can use jQuery Mobile's ThemeRoller.
jQuery Mobile framework is not important for phonegap app, you can customize your own styles using normal HTML and CSS (CSS3 also).

CSS mobile media styles with manual toggling

So I'm trying to build a mobile and desktop version of a website simultaneously (using a MediaWiki engine, if anybody is interested). Since I don't have much experience with mobile device building, I was looking around for some good mobile development practices. In the end, I feel media queries are good for what I need to do, mostly because double-publishing on separate domains (like m.foo.com vs foo.com) is not possible for this task.
The shortcoming to CSS media queries, it seems, is the apparent inability for phone users to view the site in desktop format whenever they want to (Google or YouTube is a good example of this when accessed using a phone).
Is there any way for me to freely toggle between desktop and mobile stylesheets developed with media queries? Would using javascript be too bulky for a mobile device to download?
I appreciate any suggestions. Thanks!
EDIT: For clarification, yes, I want to click a link or button on the mobile style to switch to a desktop style.
I'm 90% sure that it is not possible with CSS alone but can easily be accomplished with PHP or Javascript. It shouldn't be too bulky to use javascript.
Some examples
PHP Style Switcher.
Javascript Style Switcher
Jquery Style Switcher

do I need to write different set of code for both the orientations of Mobile phone?

I m designing an appliaction for mobile phone. Do I need to write different set of code for both the orientations of mobile? Please suggest some ideas.
Thanks
You have to use media queries css to design both orientation and have a look on this url
CSS-Tricks: Media Queries for Standard Devices
there are two ways if you are making you style sheet in pixels then you have to make separate style sheet but if you are using percentage then your style sheet works in both orientation
If you are developing a web application for pc, you need not to worry about the code related with application.All the code for pc version will be active for mobile too.But you need to worry about the page layout-for this you can build a separate mobile version or you can build a mobile compatible website by using separate stylesheet.
I will recommend you to build a separate mobile version page.But still you need not to modify the code related with application.
For mobile page, you can use jquery mobile framework
Good to see some ways you can refer here!

Categories