allow user to add/delete buttons and buttons automatically shifts positions - android

i would like to create a flexible user interface for the android platform.
basically my layout would consist of a image button with at "plus" sign at the beginning.
when teh user clicked it. another layout is called where the user is prompt to name the image button that is suppose to be created.When the user clicks confirm, he'll e brought back to the 1st layout and the newly added image button would replace the position of the "plus" sign image button and the plus sign image button would shift to the right.
i know how to create the layout initially but i dunno how to programmed it to function the way i described above.
ok so now i have my main layout file set this way:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true" >
<RelativeLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#000000" >
<ImageButton
android:id="#+id/addRoom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="25dp"
android:layout_marginTop="38dp"
android:background="#80000000"
android:src="#drawable/plus" />
<TextView
android:id="#+id/textView1"
android:layout_width="#+id/addRoom"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/addRoom"
android:layout_alignRight="#+id/addRoom"
android:layout_below="#+id/addRoom"
android:text="#string/add_room"
android:gravity="center"
android:textColor="#FFFFFF" />
</RelativeLayout>
</ScrollView>
would i have any issues when i include the fragments to shift the image button and textview when the alignment instructions to both of it.

When you want to manipulate your activity's UI in real time by the user it's recommended to use Fragments and Fragment Manager to change diffident parts of your activity's view.
You can find great information in the docs:
http://developer.android.com/guide/components/fragments.html
or
http://marakana.com/s/post/1250/android_fragments_tutorial
in your case you would do some thing like that:
fragmentTransaction = fragmentManager.beginTransaction();
fragmentTransaction.remove(plusButtonFragment)
.add(R.id.containerForFragments,userNewFragment)
.add(R.id.containerForFragments, plusButtonFragment)).commit();
after you have created the plusButtonFragment and the userNewFragment.
Update:
For managing the fragments location in a relative layout check out the next post:
How to add fragments programmatically in relativelayout

Related

Android: replace one view with another

What I need in general: replace(hide) one view with another by a button click
Let's go deep in details:
I use ViewPager, which consists of 100 images.
Layout of ViewPager
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:background="#ffffff" >
</android.support.v4.view.ViewPager>
<ImageButton
android:id="#+id/imagePlay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/imageRight"
android:layout_alignTop="#+id/imageList"
android:src="#drawable/list" />
</RelativeLayout>
Layout of Image
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="1dip"
android:background="#ffffff">
<ImageView
android:id="#+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
/>
</RelativeLayout>
It works - no problems. But I need to add button to the viewpager and after tapping image in the viewpager should be changed to the gif. It looks like gifs preview and after onclick play - gif starts to play.
Custom layout for gifs:
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/imageList"
android:layout_marginRight="28dp"
android:layout_toLeftOf="#+id/imageRight" >
<com.basv.gifmoviewview.widget.GifMovieView
android:id="#+id/gif1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
How it should be resolved? It's pretty simple for me to open another activity after tapping to the button, but the issue is to play gif in the same Fragment
Any ideas?
I'd simply add your com.basv.gifmoviewview.widget.GifMovieView somewhere to your root RelativeLayout (perhaps you may need to wrap both ViewPager and GifMovieView in additional FrameLayout) and simply show/hide it when needed using ordinary setVisibility().
EDIT
I suppose it's not the best solution for phones' memory usage
I quickly looked into the sources and there's no much code really. So if you bother memory usage you can always dynamically create widget prior showing it (and destroy once hidden) or, as I cannot see the method to "unload" a GIF, you can always use "1x1 px" empty Gif to ensure last one you just stopped showing is no longer occupying precious memory if not needed.
Here is an idea. Make that layout with both view pager and gif but the gif visibility set to invisible so that initially its there but not visible. But when someone click the button you should put that gif to life in code by setting it to visible while also changing view pager to invisible or gone in case you dont even want its initial boundary being present!!

How to display a view on top of another view in same activity

I am have an activity in android application . It displays a view (lets say CurrentView)with a button in the centre of the screen . I am setting the content of the activity using :
setContentView(R.layout.layout_xml_file);
The layout xml file defines the button.
My requirement is that , when user clicks on the button , i need to show another view (lets say NewView)containing a listView on Current View.
The NewView transition should happen like this :
It should start from bottom of the screen and should take some proportion of the screen , say 3/4 or 1/2 . I mean the view's height should be configurable .
This NewView should be in the same activity . I do not want to create another activity for displaying it.
I don't understand which android widget is should use for holding the NewView
Thanks. Your help is appreciated ...
Take a Relative Layout align to bottom and set its height what you want and inside Relative Layout Take Listview after that setVisibility gone. And when click button in activity setVisibility Visible.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<Button
android:text="Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="128dp"
android:id="#+id/button" />
<RelativeLayout
android:id="#+id/rel"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:background="#f0f0f0"
android:layout_below="#+id/button"
android:visibility="gone">
<ListView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:divider="#000"
android:dividerHeight="1dp"/>
</RelativeLayout>
</RelativeLayout>
use LinearLayout - layout_weight attribute in layout.xml
View.setVisibility(View.VISIBLE or View.GONE)
perhaps use FrameLayout for both views parent layout. Initially the list should be inivisble and button visible.
I think you are looking something like this library ->
https://github.com/umano/AndroidSlidingUpPanel

How use the mapView in activity?

In my application am use include other layout to include two view in main XML,in that first view have simple text view only and in second view i have map view.In my main XML file i have two buttons when i click first button to show first view with text view,when i click second button i want to hide the first view and to show second view with map view.I don't know how to show the map view in main activity.Can any one know please help me to solve this problem.
Firstly tell what version of google maps do you use
v1 - https://developers.google.com/maps/documentation/android/v1/
v2 - https://developers.google.com/maps/documentation/android/start
Usually what you need to do is to put you two layouts inside FrameLayout and show/hide one of them when you click on particular button. But to be more specific we need to see your code.
1) MapView is used by GoogleMapsV1. But it needs an api key provided by google for individual developers upon registration.
Unfortunately, which is closed by google and you have to use GoogleMapV2 with new V2 key.
Also, workout with fragments because, here we are using Fragment or SupportFragment.
2) You can use a FrameLayout inside which your two overlapped views with id's. So that you can show or hide views at same position as you need.
Please try to use bellow code.
<LinearLayout
android:id="#+id/buttonLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button1" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button2" />
</LinearLayout>
<ViewFlipper
android:id="#+id/viewFliper"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/buttonLayout" >
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<com.google.android.maps.MapView
android:id="#+id/mapView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:apiKey="your map key map_key"
android:clickable="true"
android:enabled="true"
android:focusable="true"
android:focusableInTouchMode="true" />
</ViewFlipper>

i want to fix an home button for all activities.how?

i am designing an application which have diff types of functionalies through buttons/image buttons. At final the list might increase. i want to put one custom home button which always keeps on screen when i am in diff activities.
or either if you have any idea about how this Home button is coded to this layout
below screen. please help.
Have you considered the Action Bar which is exactly designed for this purpose?
http://developer.android.com/guide/topics/ui/actionbar.html
While the home button at the bottom can be easily achieved using an image view/button,Using an action Bar is the recommended option.Not only can you link with the home activity but also any other activity of your choice.Refer this to gain a deeper insight.
http://developer.android.com/guide/topics/ui/actionbar.html
http://developer.android.com/reference/android/app/ActionBar.html
You can either place a button/image button/image anything in xml layout and set on click listener on that component. You can also use option menu and give multiple option on all the screens of your application.
Make a layout with a ScrollView on top, and your image-button below the scrollview.
Example:
<!-- language: lang-xml -->
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Your Content Here"
/>
</ScrollView>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher"
/>
</LinearLayout>
</LinearLayout>
It looks like this:

How to make xml definition to be re-usable (some kind of template)?

My situation is following. I have one Activity that contains three main parts. At the top of this activity there is an tools panel with two ImageButtons. At the bottom of the activity there is also tools panel similar to top. Main component of this activity is at the center of the screen which is LinearLayout that contains 3x3 ImageButtons grid. To get the context I quickly describe purpose of these grid buttons. This 3x3 grid describes states of this buttons (lets say toggle button and its states are on/off) for particular day. So for one day you have one set of 3x3 and these have its own state for particular day.Now what I trying to achieve is to have functionality which allows user to scroll between grids or dates respectively. My idea is to have ViewFlipper as the main component of the activity (instead of LinearLayout) and one or more grid of buttons. This is what I already have. I am able to switch 3x3 to another 3x3 (with states) for another day. For this I simply copy/paste my 3x3 grid XML definition and put this as children to view flipper (x-times).My idea is to have one definition of 3x3 and reuse it x-times like some kind of template so I will be able to say "I want to have another 3x3 with so and so states for this day and I want it to add this as next child to ViewFlipper".For this purpose (to have component of 3x3) I simply made class which extends LinearLayour and within it I want to generate/reuse 3x3 definition for buttons. Sure I am able to do it by java code in this new class but is some way to do it with reusing of xml (which is better to maintain and to read)?I tried to use LayoutInflater but this is probably not what I am looking for.
Thanks in advance
Edit
Here is code for main layout with flipper
<ViewFlipper android:id="#+id/view_flip"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#FF0000">
<!-- Here goes 9x9 cubbie layout programaticaly -->
</ViewFlipper>
To this fipper I adding view with this layout (this code is assigned via LayoutInflater).
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:background="#color/background" android:orientation="vertical"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:layout_weight="1">
<LinearLayout android:orientation="horizontal"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:layout_weight="1" android:gravity="center">
<LinearLayout android:layout_width="wrap_content"
android:layout_height="wrap_content" android:orientation="vertical">
<ImageButton android:id="#+id/life_att_1" style="#style/AttributeButton" />
<TextView android:id="#+id/life_att_text_1" android:text="test"
style="#style/AttributeText" />
</LinearLayout>
...
</LinearLayout>
...
</LinearLayout>
EDIT 2
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:background="#color/background" android:orientation="vertical"
android:layout_width="wrap_content" android:layout_height="fill_parent"
android:layout_weight="1" android:paddingLeft="16dip">
Only way I found here is to add paddingLeft attribute to wrapper LinearLayout (please refer to EDIT 2). I do not think that this is right solution but only solution I currently found.

Categories

Resources