Arranging buttons in a circle (Android) with lines connecting them - android

I am attempting to create a Fragment for an Android application where I have either Buttons or ImageButtons programatically arranged in a circle, with lines drawn from them to the center of the View. However, I have become stumped as to how to do this.
From my understanding, I can create a custom View in which I can override the onDraw() to draw the lines, but I cannot put the Buttons in this way. I can overlay the custom View with a FrameLayout or the like, but I do not know what type of layout to use so that the buttons can be arranged in a circle (and that this will work for various screen sizes).
Furthermore, I have to ensure that both the drawn lines and the buttons will be able to be animated together (that is, for instance, the buttons and connecting lines can move off-screen at the same rate as if they were one entity).
I have seen this post, and it is actually very similar to what I would like to do! : Dynamically arrange Buttons around a Circle . However, I do not quite have a satisfactory understanding of the answer, particularly how a Button can be created in an onDraw() with onClick still functioning.
Any suggestions would really be appreciated!

I think CircleLayout created by dmitry-zaitsev may help you to create what you want.
It has very simple implementation like below.
<ru.biovamp.widget.CircleLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/white"
app:angleOffset="90.0">
<!-- Add here any views you want -->
</ru.biovamp.widget.CircleLayout>
Second option is Creating a Rotating Dialer
Third option is Android-3D-Carousel.

Related

Putting a button on top of an imageView

So here is my problem. I've spent couple of days on this and didn't get anywhere. I've tried every layout possible, but it just doesn't seem to work.
Basically, I have a map of a floor and I want to make it so when you click on different parts of that floor, a new activity or a dialog box shows up. I want this to scale for all the devices. Why is this so difficult in Android? I would think that putting buttons on top of an image would be easy and made sure that it wouldn't move like in HTML.
I have been looking into Surface View, but wasn't sure if that's the best way to go? I can get the coordinates of the objects on the floor, would that help?
I want to implement this inside of an fragment. Thanks!
One possible solution could be to have a RelativeLayout as the base layout of your 'Floor Map' fragment, with the floor image set as its background.
Then you could add buttons or any other views to the Relativelayout at the coordinates of the objects.
If you already know how many features the floor will have, you could add the buttons statically, otherwise, loop through your array of features to add them dynamically.

Android image button format

I am making an Android app and have created some imagebuttons for navigation. However, when I assign images to the buttons, the height of the button is never fully filled by the images as can be seen here (the underlying button sticking out has been circled - more obvious in the large bottom button)
For my layout Ive used a Relative layout for the main view and a Linear layout (Vertical) to stack the buttons.
Apart from creating the buttons in xml and adding images to them, I have done no other coding on the buttons yet.
Been trying to figure out all the drawables first but its as confusing as a bag of cats.
Can anyone tell me why this is and how I can possibly fix it?
To me it just looks like you used
android:src="#drawable/image"
instead of
android:background="#drawable/image"
(That is assuming you are doing this through XML)

How many views are required as I have a view showing drawing required, do I still need surfaceview

I have already created a circle with the use of a View and have not used SurfaceView at all. I want to create buttons which when clicked on show images from the drawables. But I have read on the net that a SurfaceView is required to allow UI elements to be placed on top. Is this true, can someone please help me, as I am confused on this.
Thanks.
It's not very clear what you want to do, but if you want to place UI elements on top of each other without using SurfaceView you can you a RelativeLayout, this layout allows you to have views on top of each other, do you can have an ImageView with a drawable appearing over a button for example.
If you just want to change the background/src images of a button when clicked (for example to create a 3d effect of clicking), you can check out selectors, these allows you to specify different drawables for pressed/normal states.
If you want to create buttons on a SurfaceView, I suggest you render Bitmaps that will represent buttons. You will have to programmatically check if the touch coordinates are in the bounds of that bitmap tough, to register a button click.
I hope this helps.

iOS: Relative Positioning like Android's layouts

Is there any way position views relative to each other like you can with Android layouts?
Example: You have two UILabels that are dynamically set to strings of variable length, one above the other, and you want the bottom label to appear directly below the last line of the top label, regardless of how many lines the top label ends up having.
Another example: Same situation as above, but one of the labels is sometimes hidden. You want the resulting label(s) to be centered vertically in the parent, regardless of whether it's one label or two labels.
Android's Linear Layout and Relative Layout make this very easy to do, but I can't figure out how to do this is iOS. Can it be done?
You will be able to do this using AutoLayout in iOS6. For an application that should run in iOS before 6.0, you have to do it by yourself, but this is not very complicated.
Actually I have implemented a class to do this (that's a long time ago, I hope it still works, but there is no reason not to). This OHStackView class is a subclass of UIView that automatically layout its subviews horizontally or vertically to stack or align them.
You can ask OHStackView to stack its subviews horizontally or vertically (one above the other, etc), or align their top/bottom/left/right borders or their centers, and even specify a padding between each subviews. Each time one of the subview changes its frame or size, OHStackView will automatically relayout all depending views to realign everything.
(E.g with your two UILabels, a simple call to sizeToFit on your labels to make them adjust their size to their content will relayout everything around automagically)
There is an example project provided so feel free to test it.
Note: IIRC, my subclass does not take the "hidden" property of the subviews into account. But you can easily add support to this behavior by adding a condition like if (v.hidden) continue; in the for loop of its layoutSubview implementation to only take non-hidden views into account in the layout algorithm.
HTH
I've been searching if it's possible for a long time. As far as i can tell, it's not possible for now. I don't remember where i read this,but it will be possible with ios6. Instead of using Android's Linear Layout,you can use sizeWithFont method to detect size of your UILabel,then you can set their frame to position them.First,you need to set their text of course to find their size according to their font family. Another thing you can use is sizeToFit method. Unfortunately,i don't know how to use it. You can give a shot,though. At that time,i found this.Maybe ,you can use it https://github.com/scalessec/CSLinearLayoutView

Drag to dynamically resize a pair of adjacent layouts on Android

I have a pair of adjacent views in an Android application. I'd like to give the user the ability to drag a widget to change the relative size of the two views within a larger container. If SlidingDrawer let the user pin the drawer wherever they wanted, that'd likely get me what I want.
My Google 'fu is failing me. I can't find a single example of this anywhere.
Thanks!
I ended up putting together a bit of code to create a custom LinearLayout subclass to do what I wanted.
The code is at https://github.com/k9mail/splitview

Categories

Resources