Most Android devices feature a home screen which you can scroll horizontally by dragging (there're others that have a grid-like 2d scrolling feature too, but I'm only interested in horizontal scrolling).
Could someone shed some light for me on how this might be achieved?
First I was thinking about using a custom ViewFlipper. I could attach proper sliding animations for it, but it's not exactly the same thing. On the home screen, the "amount of sliding" depends on how far you've dragged your finger on the screen. Animations are fire-and-forget things, I can't stop them midway.
Any ideas?
Here's a video about the desired behaviour: http://www.youtube.com/watch?v=UGdWM2TQNSo&feature=player_detailpage#t=104s
You can take a look at the way Android's stock Launcher app does this here: https://android.googlesource.com/platform/packages/apps/Launcher2/+/master/src/com/android/launcher2/Workspace.java
You're primarily interested in the onTouchEvent, onInterceptTouchEvent, and computeScroll methods.
Google released the compatibility pack with some new UI Elements, which you can download via SDK Manager.
put the .jar file located in sdkfolder/extras/compatibility in your build path.
now you can use a class called ViewPager which behaves like the Android Homescreen.
Or, if you are using Eclipse and ADT plugin v12 or higher, just right click your project, choose "Android Tools" and then "add compatibility package".
Related
I'm developing quite a few homescreen widgets and currently I have to install them on my emulator or my phone in order to preview the layout.
Is it possible to preview the layout in Eclipse? When I open the XML of my layout in the preview mode, it displays it as it it were an activity and therefore the scaling is entirely wrong.
You can use jimu as a plugin into Eclipse to achieve it. Jimu is a drag & drop style App creation tool for Android. That's the most suitable tool to allow you achieve what you have in mind to get WYSIWYG, as it will enable you to have live previews of Android layouts. You have also the option to use it with Eclipse, or with Android Studio or any other editor of your choice.
To avoid the need to compile-install-run, jimu Mirror gives you live previews of your app that update as you code.
As you can image, the most positive fact about Jimu is that it speeds up Apps development times.
Alternatively, you can use IntelliJ IDEA. IntelliJ IDEA also allows you UI layouts preview.
Thus allowing you achieve WYSIWYG. And equally IntelliJ IDEA gives you the option to integrate it with Eclipse. Of course, alternatively you may decide to simply completely to move to Intellij IDEA. It is available in a commercial edition as well as in a free open source community edition.
IntelliJ IDEA UI designer allows you to build application UI by dragging widgets from its side palette. In version 13 you can simultaneously preview the UI you’re creating on multiple devices, by just selecting Preview All Screen Sizes from the device drop-down. Preview displays all changes made through the UI designer or XML editor in real time.
Such tools for GUI implementation from Jimu and IntelliJ IDEA remembers a little bit Qt Designer, which is available also for Android. In fact, any approach that properly works, allowing interactive Android UI quick development, is a greatly welcome valuable tool for developers that should be well used to improve productivity.
At the top of the view in Eclipse switch to the Holo Panel theme. If you need your own theme attributes then create tour own theme override that parent's to this. Then you could choose that in the editor.
it displays it as it it were an activity and therefore the scaling is entirely wrong.
If it displays as an Activity, then create a dummy Activity that mimics the home screen. Then use a theme, or use an include tag to include the layout from your widget into the cell(s) of that larger dummy home screen.
This solution isn't ideal, but it should be able to give you a better approximation (if what you're looking for is just to tweak the layout of your widget).
I am trying to develop custom launcher app (with unlimited number of home pages)and i need to implement Drag and Drop as done in Launcher2(android 4.2).
So i found two approaches
1) Drag and Drop framework
2) Use the android launcher2 way like implementation DragController, DragSource as explained here.
But i am struggling to understand why didn't Android guys didn't use the Drag and Drop framework developed by them in their own application. Can anyone brief regarding possible rationale behind their approach?( i mean in terms of memory/performance)
Thanks in advance.
The Android drag and drop framework is very basic as compared to the one used in the Launcher app.
The Launcher app has a myriad of "layers" and the drag and drop occurs accross these layers, namely the DragLayer, Workspace and the All Apps view etc. It uses window flags and dynamically adds/removes views to the DragLayer when a drag is in progress and a multitude of activities monitor the drag. For more details look at the DragLayer.java and Workspace.java files particularly.
Drag and Drop in Android Launcher is done as Overlay drawing within the same ViewGroup and in same window . But android drag and drop approach creates a separate window with a separate window type altogether .
Resource and memory wise standard android drag and drop approach is costlier.
If performance is very critical my suggestion is go as per Android launcher way else prefer standard android approach its easy and simple.
Drag and Drop framework is sice api 11.
My guess is, lot of code for launcher was written before that, and noone had time to refactor it yet. But api works similar like second approach.
http://javapapers.com/android/android-drag-and-drop/. This is the best drag and drop example since i have implemented the same in my application. Note: It will support versions only above 11. The drag and drop feature will not support for version 10. Instead u have to move the fields in a absolute layout by settin X and Y positons. But Absolute layout is completely deprecated...
You should use WindowManaager to control Drag And Drop if in case your Application is not so much complex. This is easy to implement and work on Position changed. get the code Here
If you have installed most of mediaplayers like files managers like ES File Explores, users that touches the screen and move to left or right, the pages moves to left or right. That is exactly like build in android music player for 2.3, when user next music. How can I implement this?
You can do it by using a ViewPager widget. Note that its part of the compatibility library so it can be used from API4 and above. Otherwise, you could always implement all this manually.
http://developer.android.com/reference/android/support/v4/view/ViewPager.html
You are thinking of the ViewPager widget. This is available in the Android Support Package, as K-ballo described. Titles/tabs are not included by default, however... if you want your pages to have titles or tabs (i.e. the Google Play store), you can check out Jake Wharton's ViewPagerIndicator.
I am developing a mobile app using Titanium. I came across the Google Plus, Tweetdeck, Market Apps for Android. To switch between the tabs they use the slide gesture. Its like the next view simply slides in based on your swipe/drag. I would also like to add the same kind to behavior for my app I would like to have it work on both Android and iOS platforms. How can I have it?
I have tried Ti.UI.scrollableView. The problems I faced were
The sliding was not as responsive as seen in the above apps.
The view does not move along with the finger drag. It moves after the finger drag is finished.
It seems to take more memory as the application response slows drastically and animations dont appear to be smooth.
Kindly let me know if there is any other alternative to implement this kind of experience in the app.
Thanks!!
What you basically need is a Ti.UI.ScrollableView which implements the native Android ViewPager. Those other Apps are binding their Tabs to the ViewPager. You can't do this with a Ti.UI.TabGroup but you can either use your own Tab views or some other module that provides this functionality like this. You could also have a look at my Alloy widget here - it provides a custom tab-indicator for Ti.UI.ScrollableView (without another module).
For Android you should consider using a third-party library to implement such functionality.
Personally I use PagerSlidingTabStrip which I have found that works really well.
I am planning to implement Honeycomb tablet application based on WebView (so, basically it'll be a HTML5 web based application made only for tablet).
I am looking to implement horizontal and vertical scrolling by swiping finger. For better understanding I created sample outline.
This image shows something similar to Honeycomb's native setting activity with left and right page vertically scrollable
Any kind of guides or resources are welcome. Thanks
Take a look at iScroll:
iScroll 4 is a complete rewrite of the original iScroll code. The script development began because mobile webkit (on iPhone, iPad, Android) does not provide a native way to scroll content inside a fixed width/height element. This unfortunate situation prevents any web-app to have a position:absolute header and/or footer and a scrolling central area for contents.
While latest Android revisions are supporting this functionality (although support is not optimal), Apple seems reluctant to add one finger scrolling to divs...
Here is what I have found so far:
It depends on how you want to implement scrolling. If you want to attached swiping event, thats the easiest way to implement using well known libraries:
jqTouch - It has swipe left and right event which can be hooked to scroll left or right (it seems all the webkit based animations work only on iOS devices). Please note that project is still in beta and not highly active. EDIT: this is also part of Sencha Labs - who actively maintains Sencha Touch.
Sencha Touch - They have better support for almost everything in mobile and tablet. (Note: It's free for opensource apps but not for commercial apps - EDIT: they actually have commercial license. see their site for more info on licensing)
jQueryMobile - They are very stable (in RC1 as of now), and has swipe left and right event, but I could not find swipe up or down. If you just need swipe left right, tap, tap hold, then go with jQM. They have the best community support.
RAW JS - Finally, if you want something raw javascript, visit HTML5Rocks article to have better in-depth idea about how touch event works.
I hope it helps. I'm still struggling to implement scroll up down, since I don't want to wait for swipe to end, instead I am trying to implement instant scroll feedback, getting very close using RAW JS coordinates, but not satisfactory.
Hammer JS has been useful for me:
http://eightmedia.github.io/hammer.js/
From the creators of iScroll, SwipeView seems a nice dedicated alternative. Have a look at demo 1 and demo 2.
I have not tested yet, but I will surely. Since demos behave well on my iPad.
You might find this library quite useful: https://github.com/cubiq/2-way-iScroll
It handles the case of vertical scroll and horizontal swipe.