11

I need to implement a wheel like control (a slot machine) like in the picture.

enter image description here

But the edges (the position between the items) of each item need to be smoothened so that it will look like a globe like the earth. This is a screen shot of iPhone app achieved from a library for iPhone. I want it in android. I checked the kankan wheel (Android wheel) but it does not serves my needs. However it's cyclic behavior is needed for me. And I checked the following link also.

http://developer.sonymobile.com/2010/06/23/android-tutorial-making-your-own-3d-list-part-3/

I played with canvas and matrix with some values for methods pretranslate post translate scale etc. But I haven't any idea about how it works, what the impact it will do with a specific value for skew etc. When I discussed with UI designers they told me that to achive this screen design use "skew" or "perspective" property. But I haven't an idea how to skew or apply perspective to an image in android. I tried to apply some values to skew in the on drawChild() method of the custom list view (used the list view implementation of this link http://developer.sonymobile.com/2010/06/23/android-tutorial-making-your-own-3d-list-part-3/) . But the view became invisible.

I can't use the scale behaviour of matrix because it will insert gaps between each child views.

I need to know how will implement the following behaviours as well. The needs are

  1. Once the user tries to scroll it will check the threshold and do scroll only if the threshold is higher than a configured threshold.

  2. The items scroll cyclic, in a sense that, after the lastitem the wheel show the first item and so on. If there is only one item, then the wheel should fill with the single item.

  3. Once the view is scrolled all the touch are disabled till the wheel ends.

  4. The wheel should scroll for a specific provided time (to calculate the gift from back end and determine which item should be at the centre of the view.

  5. When we set an item to be selected with setSelected() or setSelection() methods like in kankan wheel demo (Android wheel), the wheel should gradually decelerates to the specified position rather than immediatley stops the wheel to the that position.

droid kid
  • 7,569
  • 2
  • 32
  • 37
  • Hi, Were you able to solve yor problem? Can you enlightenme, how did u achieve this? I dont want a 3d list. I just want to have the 5th point implemented. Any reply would be highly appreciated. – Payal Apr 30 '15 at 05:22
  • No. I havnt implemented this feature since it was changed by the client. Thank god!!!. The closest solution I found is the wheel library mentioned by @breadbin. For the 5th point you can use the smoothScrollToPosition(position) function of listview – droid kid Apr 30 '15 at 06:13
  • Thanks !! I am implementing that library only but I dont see smoothScrollToPosition(position) in there . I guess I will have to create my own method :( – Payal Apr 30 '15 at 06:25
  • No. moothScrollToPosition() is the method of listview. I thought u are not using that library – droid kid Apr 30 '15 at 07:02
  • yeah thats the issue .Mine is a slot game. Please have a look at this question if you could suggest something http://stackoverflow.com/questions/29749295/android-kankan-wheel-modification – Payal Apr 30 '15 at 07:13

4 Answers4

1

For the perspective, look at http://developer.android.com/reference/android/graphics/Camera.html

You set the location of the camera, and then get the matrix, and use it to draw the image.It will set the skew, and scale for you.

yoah
  • 7,180
  • 2
  • 30
  • 30
1

I dont know how close you are to achieving your goal but you may want to skip using android classes and use a 3d engine like cocos 3d for android. Importing a model and making it clickable in the right spots and all that kind of stuff would be abstracted for you so you dont spend time messing around with other things.

James andresakis
  • 5,335
  • 9
  • 53
  • 88
  • Yea...i tried android animations to achieve this. Now i think its better to try out some 3d engines like you said. Not know how much support they provide for the native android classes. – droid kid Nov 16 '13 at 01:58
1

enter image description here

Just try this, keep 6 views 5 as shown in image and one in reserve. When the view 1 goes out of scope the reserve view came in with the next image & the view 1 became the reserve view similarly you should render the cycle as many times you want.

The width grows while it moves from bottom to center and shrinks when it rolls towards top

Viswanath Lekshmanan
  • 9,945
  • 1
  • 40
  • 64
0

Have you seen this? You may be able to adjust it but it's a starting point at least https://code.google.com/p/android-wheel/

UPDATE: the project has moved to github

Someone Somewhere
  • 23,475
  • 11
  • 118
  • 166
Breadbin
  • 410
  • 4
  • 15