How and what to use to make this component - android

I have a very specific component to realize. I don't really know how to do it.
The component is a segmented bar with a cursor that can select any segment. A segment selection should update the number of segment in the bar. A segment could have two "state" which is represented with 2 differents graphics.
IE :
This may sound like a rating Bar but i really don't know how to proceed (new with java and android).
Should i use Rating Bar and just change the stars by segments ?
Should i extend RatingBar (how ?) ?
Any help will be appreciated

Looks like you're going to have to write your own view. Don't worry - it's not so difficult (I did my first one without any sweat after 2 days of doing Android). Basically you have a class which extends View and you override the onDraw function which draws directly to the supplied Canvas. Make sure you override the onMeasure function too or your view will have no height!
Have a look at the android page on Building Custom Components - a quick google or stack overflow search will give you many hints as to how to proceed too.
Once you work out how to write a custom view (start with a small prototype) then you just need the logic of how this specific controller works. I'd probably have a collection to hold each of your segments, with each item being a class representing your data. In your onDraw then you just have to process the collection and draw to the screen.
To get your touch to zoom, override the onTouchEventmethod, which will give you a MotionEvent object which you can call getX() and getY() on to return the coordinates of where the user touched your view - from there you can work out what segment the user touched and process the zoom.
Let me know if you need any more help.

This doesnt look to hard to achieve.
Create a custom view, override onDraw() and go from there; each section probably would be a rectangle, and since you know how many sections there are you can divide the with to the amount of sections, and draw them on the correct positions.
Override ontouch and check the motionevent for click locations, do a hit test to figure out which segment is clicked on, then set a boolean zoom to true, invalidate the view such that it gets redrawn and draw just the zoomed segments.
You would probably want to back this up by a simple array containing the state for each of the sections.

Related

What is the best way to draw arbitrary objects in Android?

I've recently started building my second android app and I've hit a wall. What I want to know in general is this. In almost all other programming languages that I've used there is a simple way of drawing arbitrarily on screen. Usually there is some sort of Scene or Canvas type class and another GraphicObject type class. So If, say, I want to draw a car, I create a class that descends from GraphicObject and define they it draws itself and then add an instantiation of the Car class (the object) to the Scene. If I want a second car, you just instantiate another and put it wherever you like, by setting some kind of coordinate function. If this is a program where what is drawn depends on user input, everything must be done programatically and hence it does not depend on anything other than the code written.
How do you achieve this in Android? As far as I can muster the only object which you can define the way it is drawn is a View. However I have not been able to simply take my custom view (that draws a rectangle in my case) and instantiate two of them a put them in the screen where I want them, and do this in a programtic simple way....
Thank you for any advice.
Well if I want to draw lets say 10 rectangles then I wont instantiate my custom View 10 times. Instead I will add logic in my custom View to be able to draw 10 or more rectangles. Anyway if you want to draw again what was drawn in a View then you can call setDrawingCacheEnabled(true); on your View and then call getDrawingCache() to get Bitmap to draw it somewhere else.
Its almost same in android also,
All the widgets are inherited from class View, by extending this class you can actually create whatever you want limiting by only yours imagination, you have access to canvas here, use it along with touch controls exposed from class itself to override all the behaviours you want as per your need,.
http://developer.android.com/reference/android/view/View.html
http://developer.android.com/reference/android/graphics/Canvas.html

How do i create a custom clickable graphic for my android app?

I want to create an interactive graphic for my app. It will essentially be a simple picture of a bus line where users can select 2 stops at a time (one for departure times and another for arrivals) I'm not sure how to create this image though, and have it have 20 or so different clickable points. Is there a framework I could use for this? Or is there a way to do this in pure android?
Thanks for the help.
I would suggest writing an onClick listener and using a collection of Rect instances to manage the collision/position of the 'click'. Check out the on click page and the rect page.
One thing to keep in mind are the origin point of your clicks, I'd assume you'll want to use one corner of your image as the point (0,0) and reference everything (clicks and rects) from there.
I would say try to create an ImageView to load your image and set a touch event listener or a click listener to that view. Hard code all places that you want your image to react upon a click.
Check click using an event listener would require you to handle both ACTION_DOWN and ACTION_UP in the MotionEvent object passed in. But it's easier to grab the coordinate of where the user clicks on the page, so you only need one listener but needs to put more work on handling the conversion from the coordinate passed in by MotionEvent to the coordinate on image. This is particular a major issue when your image can be sized larger than the screen size.
Using a click listener would save you from this trouble. As #smitec said, you need to overlay rectangles on your image as "buttons", so you can react to user input based on which buttons they pressed. This way you need to bind listeners to all of them (I suppose) and hard code their positions on your image. But, as mentioned earlier, it saves you from dealing with coordinates later on.

How to draw a shape in Android as one of other layout objects?

I've been working on this for a while but can't find anything that exactly addresses my question (at least not something easy to understand).
I have a main layout XML file where I define various layout objects like a Button or a TextView (and I know I can add SurfaceView, View, and view and other things too). I want to draw a shape (in my case it's an arc) in just one of these objects so it doesn't take up the whole screen and so I can position it relative to other things.
(In my case it will ultimately re-draw the arc kind of like a circle with a gap in a different position every time I call a method depending on a value I pass to the method, but that's separate from my basic question.)
I know the answer will have something to do with a canvas, an onDraw method, maybe Paint, probably a view. I have been able to draw a circle from a custom View object by setting the main java file's layout as that View (as opposed to R.layouts.main), but that takes up the whole screen, and I'm unsure how I might be able to have that dynamically draw with modifications.
A really clear explanation or better yet an actual example would just be awesome.
As i see it u need to draw a specific shape on widget and not on complete screen. Try using layer List.
you can refer this link for sample Link

Android dynamic text drawing / touch detection

I want to display text (relatively large) and determine which character the user touches. I'd also like to embellish the text by drawing a circle (for example) over certain characters. How do I know which characters are at what location? Enforcing monospaced font would be fine if helpful programmatically.
Would it also be able to make this one line of text scroll left/right (using touch->slide) and still have touch work to determine the correct character?
A very broad question, and you've got a lot of work ahead, but here's the outline of one possible solution:
Create a custom view. ImageView is often a good base class to
inherit.
Override the onDraw() method of the view.
Use canvas.drawText() to place your text on screen.
Use paint.getTextBounds to meausure your text. See the discussion
linked below for a thorough understanding. Since you drew the text
on screen, and you measured it, you know exactly where each
character is.
Override the onTouch() method in your custom view and track the
events you need. There are many QAs here in SO on how to do this.
For scrolling the text, use canvas.translate() using the movement
you calculate in the onTouch(). Since you know how much you
scrolled (translated), you know how far your characters have moved
and can offset your touch detection to detect character touches.
Finally, since you now control all of the drawing and, your
character positions are abstract, only having meaning when compared
to a touch position, you can embellish them in any way choose.
Android Paint: .measureText() vs .getTextBounds()
Phew!
Good luck.

Animation/dragging of an object in Android

I have a custom view (extends View) that is going to be a game board. What I'd like to do now is create an object (well, a bunch of them, but I can start with one) at a specific location on the board and then have the user be able to move it around by dragging it. I have the board view down, but am at a loss on how to code up the "pieces." Thanks for any help and/or pointing to the right place here.
Some pointers:
You will need to capture the user's touch 'n drag. Unfortunately you can't use a GestureDetector.SimpleOnGestureListener for this (it would see it as a scroll), so you'll have to do this in your view's onTouchEvent. This is a little tricky - refer to the SimpleOnGestureListener source code for ideas on how best to do this.
As you update the location of the object call invalidate() on the view to trigger the re-draw
In onDraw() do the background and then draw your object on top
If you are just doing the one object at once this should be sufficient. If there's more to it that this you may have to graduate to a SurfaceView and a separate thread - but don't go there until you need to.

Categories

Resources