Android List Below Toggle Buttons - android

I have a list that is intended to be below toggle buttons. The list grabs data from a server and then parses them. My XML is as follows:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<ToggleButton
android:id="#+id/toggle_button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textOff="Apps"
android:textOn="Apps" />
<ToggleButton
android:id="#+id/toggle_button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/toggle_button1"
android:layout_weight="1"
android:textOff="VMs"
android:textOn="VMs" />
<ToggleButton
android:id="#+id/toggle_button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/toggle_button2"
android:layout_weight="1"
android:textOff="Groups"
android:textOn="Groups" />
<ListView
android:id="#+id/mylist"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/toggle_button1" />
</RelativeLayout>
Code for the actual fragment:
public class ProblemFragment extends SherlockListFragment
{
private SeparatedListAdapter list;
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
this.getSherlockActivity().setContentView(R.layout.problem_layout);
list = new SeparatedListAdapter(this.getSherlockActivity(), new Layout(R.layout.separated_list_adapter_two_text, R.id.two_text_title, R.id.two_text_desc));
ToggleButton b1 = (ToggleButton) this.getSherlockActivity().findViewById(R.id.toggle_button1);
ToggleButton b2 = (ToggleButton) this.getSherlockActivity().findViewById(R.id.toggle_button2);
ToggleButton b3 = (ToggleButton) this.getSherlockActivity().findViewById(R.id.toggle_button3);
setListAdapter(list);
refresh();
}
public void refresh()
{
list = new SeparatedListAdapter(this.getSherlockActivity(), new Layout(R.layout.separated_list_adapter_two_text, R.id.two_text_title, R.id.two_text_desc));
refreshStats();
}
public void refreshStats()
{
//Omitted parsing code
list.addSection(new String("Hello world!!"));
setListAdapter(list);
}
}
However, when I use setListAdapter(list), the buttons are overwritten. They are visible before the app retrieves the data and parses it, but they are overwritten after I call setListAdapter. How can i fix this?

First, remove
android:orientation="horizontal"
from your root layout. RelativeLayout doesn't have an orientation property. Also, weight is for child elements of a LinearLayout and when you use it then you should assign the width of each child view to 0dp for horizontal orientation and height="0dp" for vertical orientation.
Then wrap your ToggleButtons in a LinearLayout, vertical or horizontal orientation, and give it the property
android:layout_alignParentTop="true"
then give your ListView the property
android:layout_below="#id/idOfLinearLayout"
So it may look something like
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:id="#+id/toggleLL"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true">
<ToggleButton
android:id="#+id/toggle_button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textOff="Apps"
android:textOn="Apps" />
<ToggleButton
android:id="#+id/toggle_button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textOff="VMs"
android:textOn="VMs" />
<ToggleButton
android:id="#+id/toggle_button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textOff="Groups"
android:textOn="Groups" />
</LinearLayout>
<ListView
android:id="#+id/mylist"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/toggleLL" />
</RelativeLayout>
I also removed the RelativeLayout properties from the ToggleButtons since they are now wrapped in a LinearLayout. And you had a circular view error there with assigning the second ToggleButton to the right of itself which may have been a copy/paste error. Hope this helps.
Note that the default orientation for a LinearLayout is horizontal so leaving that property out will give you that effect.

Oh! I can not test your XML but I think that you need scrollbars! If the list is filled with a lot of entries, it can became bigger that the screen, making the buttons disappear because they are pushed up by the list. Try to add a scroll to the whole layout.
Something like this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<ScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<!-- Original layout here -->
</ScrollView>
</LinearLayout>
Of course, if you just put only one layout inside the scrollview, there is no need for the outer layout:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Original layout here -->
</ScrollView>

Related

How can I have one unique button in multiple components of a layout in android?

So I have an xml that consists of a linear layout containing a Button and a TextView like this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="100dp"
android:orientation="vertical">
<Button
android:id="#+id/btnCell"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:paddingLeft="40dp"
android:text="Button"
android:textColor="#color/blueText" />
<View
android:height="wrap_content"
android:width="wrap_content"
android:background="#drawable/Test"/>
</LinearLayout>
And I want to use this same layout inside other layouts in a different xml. I need the same button at every time, so I reuse it by including it in the two layouts (both layouts are in the same xml, but ones is hidden):
First one
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/image"
/>
<include layout="#layout/buttonLayout"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
Second One:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:visibility="gone"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/image"
/>
<include layout="#layout/buttonLayout"/>
<CheckBox
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
So I show the first layout and hide the second one at the beginning of the app , as the user moves within the interface, the layouts exchange so that the other one is shown and the first one hidden.
The thing is that I declare the Button in my java activity class like this:
btnCell = (Button) thirdView.findViewById(R.id.btnCell);
btnCell.setOnClickListener(this);
And implemented the listener.
#Override
public void onClick(View v) {
if (v == btnCell) {
System.out.println("entered if");
}
System.out.println("entered function");
}
The problem is that when I click the button when the first view is shown and the second hidden, the button works just fine, but when I unhide the second layout, hide the first one, and proceed to click the button, that should be the same as the first one but in a different layout, nothing happens. I searched and find out, that this happens because the id is assigned only to the button shown in the first layout because of view hierarchy, but not the one in the second layout. How can I make both buttons react to the same action, without declaring a new button in each layout but instead reusing it?
I have used this type of layout. you can create Id different for both and inflate that view and give different name so You can differentiate both thing.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/image"
/>
<include android:id="+id/firstOne" layout="#layout/buttonLayout"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
android second one is
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:visibility="gone"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/image"
/>
<include android:id="+id/secondTwo" layout="#layout/buttonLayout"/>
<CheckBox
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
The Problem is both the layout are include in same layout file and the id of that
button are same so whenever you click on any of the button at the same time event will fire on both button like both are clicked.
So, you have to give the different id for both the button I hope it works fine..
You can add a different Id for each included layout:
<include android:id="+id/layout_a" layout="#layout/buttonLayout"/>
and
<include android:id="+id/layout_b" layout="#layout/buttonLayout"/>
and then use two findViewById to reach them:
btnCellA = (Button)thirdView.findViewById(R.id.layout_a).findViewById(R.id.btnCell);
btnCellB = (Button)thirdView.findViewById(R.id.layout_b).findViewById(R.id.btnCell);

Android: Custom FlowLayout

I want to make this kind of menu of tags in android. Fill layout dynamically and align to center.
How can I do that?
Edited using library recommended by #Dory
<FlowLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:f="http://schemas.android.com/apk/res-auto"
android:orientation="horizontal"
f:debugDraw="false"
f:weightDefault="0"
f:layoutDirection="ltr"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="6dip"
android:paddingTop="6dip"
android:paddingRight="12dip"
android:paddingBottom="12dip"
android:background="#android:color/black"
android:id="#+id/l_flow"/>
<Button xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="3dp"/>
Flowlayout in one xml file Button is in another xml file. I'm inflating Button then fLayout.addView(button);
what I get is this Padding top and bottom between views is higher than expected
finally I did it with help of this library. I have used only class FlowLayout and attr.xml My main.xml looks like this:
<com.example.FlowTest.FlowLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/flow"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:background="#android:color/white"/>
and my item layout looks like this:
<Button xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:padding="5dp"/>
And in my Activity's onCreate method:
LayoutInflater mInflater = LayoutInflater.from(this);
mFlowLayout = (FlowLayout) findViewById(R.id.flow);
String [] names = {"goods", "shops", "cars", "washing machine","blablabla","clothes","books"};
for(int i = 0; i<names.length;i++){
Button b = (Button)mInflater.inflate(R.layout.item_flow,mFlowLayout, false);
b.setText(names[i]);
mFlowLayout.addView(b);
}
Take a look
here, you can use this library
Edit:
There is attributes provided in the where you can set horizontal and verticalspacing of the Flow Layout. See below sample xml :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:f="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<FlowLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
f:horizontalSpacing="5dp"
f:verticalSpacing="5dp" />
</RelativeLayout>
Happy coding :)

inflating layout

I'd like to achieve such a layout, where user got 2 control panels. He is able to switch from first to second by pressing button and vice versa.
Already have tried to use LayoutInflater, however, without success :/
The main reason, why doing it with 2 different layouts is, that buttons will be almost on the same position, so i'd like to prevent all that mess in one layout and create 2 separate control panel layouts.
Here are my layouts:
main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layout_root"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/control_panel_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="5">
<!-- Here comes including layouts-->
</RelativeLayout>
</LinearLayout>
control_panel_1.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/control_panel1"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="#+id/btn_action1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_action_selector"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />
<Button
android:id="#+id/btn_action2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_action_selector2"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/btn_action1"
android:layout_marginRight="50dp"/>
<Button
android:id="#+id/btn_action3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_action_selector3"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/btn_action1"
android:layout_marginLeft="50dp" />
</RelativeLayout>
control_panel_2.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/control_panel1"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="#+id/btn_action3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_action_selector4"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />
<Button
android:id="#+id/btn_action4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_action_selector5"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/btn_action3"
android:layout_marginTop="20dp"
android:layout_marginRight="60dp"/>
</RelativeLayout>
MainActivity.java
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.layout_root);
RelativeLayout controlPanelLayout = (RelativeLayout) findViewById(R.id.control_panel_layout);
//Inflate first control panel on activity start
LayoutInflater layoutInflater = (LayoutInflater)
this.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View controlPanel1 = layoutInflater.inflate(R.layout.control_panel_1.xml);
controlPanelLayout.addView(controlPanel1)
}
EDIT:
As shown in the image, let's say activity starts with Screen1 and once user press Btn1, Screen2 appears...as you can see, only control panel has been switched.
however, it won't inflate that layout at start of application...
Thanks in advance for any suggestions, hints...
Inflate your control panel in onCreateView() and when handling button click (to change panel). The code should be somewhat like this:
private void inflateYourPanel(int panelLayoutID, ViewGroup placeholder) {
placeholder.removeAllViews();
View view = LayoutInflater.from(mActivity).inflate(panelLayoutID, placeholder, false);
//find your views and set values and listeners
placeholder.addView(view);
}
Edit: placeholder may be any layout (control_panel_layout) inflated when starting activity etc
Still may be you'd better look at Fragments - it may fit your purpose better and provide more scalability

Resize layout to get into other layout

I created a menuView.xml layout to be in all of the layouts of my activity. This layout has one column on each border and a title bar like this:
ComposeView http://img845.imageshack.us/img845/2121/d6zp.png
I insert this layout in the other layouts this way:
<!-- Show menu -->
<com.example.MenuView
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
But if one of the layouts has full screen view, part of this view gets covered by the MenuView, so...
How could I tell to this view to adapt its size to the blank space inside the MenuView to not get covered by it?
UPDATE -- full XML included
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:background="#drawable/degradado">
<!-- Show menu -->
<com.example.MenuView
android:layout_width="match_parent"
android:layout_height="match_parent" />
<RelativeLayout
android:id="#+id/Left_layout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentBottom="true" >
//Here go buttons, views, etc...
</RelativeLayout>
<RelativeLayout
android:id="#+id/Right_layout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true" >
//Here go buttons, views, etc...
</RelativeLayout>
What happens here is that these 2 Relative layouts get covered by the MenuView (The darkest gre borders and the top black bar), and the ideal way would be that these 2 layouts get fitted to the blank space (the clearest gray).
I can solve this setting margin sizes to the Relative layouts to fit inside of it, but i know this is not the best way to do it, so I don't know if there is another way.
I think the best way to solve your issue is with inheritance.
If you define an Activity that can be used as a template for all your fleshed out Activitys to add their content to.
I don't know what you custom menu is 'made of' but as a simple example:
Create a basic Activity with code:
public class ActivityWithMenu extends Activity
{
#Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_with_menu_layout);
}
}
and xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ActivityWithMenu" >
<TextView
android:layout_width="match_parent"
android:layout_height="20dip"
android:background="#ff000000"
android:textColor="#ffffffff"
android:text="Main Menu Title Bar"
android:id="#+id/mainmenutitle" />
<LinearLayout
android:layout_width="20dip"
android:layout_height="match_parent"
android:layout_below="#+id/mainmenutitle"
android:layout_alignParentLeft="true"
android:background="#ff999999"
android:orientation="vertical"
android:id="#+id/lefthandmenu" />
<LinearLayout
android:layout_width="20dip"
android:layout_height="match_parent"
android:layout_below="#+id/mainmenutitle"
android:layout_alignParentRight="true"
android:background="#ff999999"
android:orientation="vertical"
android:id="#+id/righthandmenu" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toLeftOf="#+id/righthandmenu"
android:layout_toRightOf="#+id/lefthandmenu"
android:layout_below="#+id/mainmenutitle"
android:orientation="vertical"
android:id="#+id/activitycontent"
/>
</RelativeLayout>
Then create your xml for a specific Activity, in this case a simple 'Hello World' layout:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ff00ff00"
android:text="Hello World!"
/>
</LinearLayout>
</ScrollView>
But now when you write the code for this Activity, extend 'ActivityWithMenu' instead of the Activity class direct and inflate this xml layout as follows:
public class Activity1 extends ActivityWithMenu
{
#Override
protected void onCreate(Bundle savedInstanceState)
{
requestWindowFeature(Window.FEATURE_NO_TITLE);
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.LayoutParams.FLAG_FULLSCREEN);
super.onCreate(savedInstanceState);
LinearLayout ll = (LinearLayout)findViewById(R.id.activitycontent);
ScrollView sv = (ScrollView)this.getLayoutInflater().inflate(R.layout.activity1_layout, ll, false);
ll.addView(sv);
}
}
I have added the code for making the Activity fullscreen here instead of in the parent ActivityWithMenu class assuming that you wouldn't want them all displayed that way but you could move it into the parent class if appropriate.
Hope this helps.

cannot load linear layout from main.xml in a dyanimic layout

I am trying to make dynamic layout in which there is a scroll view.
In the scroll view , I am adding vertical linear layout which references main.xml.
The code stops as soon , I try to add the layout referencing main.xml.
ScrollView scroll;
EditText search;
Button checkin;
LinearLayout vt;
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
scroll=new ScrollView(getApplicationContext());
vt=(LinearLayout) findViewById(R.id.llv);///referencing linear layout located in main.xml.This is where problem the is occurring.
//vt.setOrientation(LinearLayout.VERTICAL);
scroll.addView(vt);
this.setContentView(scroll);
}
main.xml ( where R.id.llv is located )
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/llv"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/hello" />
<ToggleButton
android:id="#+id/toggleButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ToggleButton" />
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
</LinearLayout>
</LinearLayout>
try to add
setContentView(R.layout.main);
before:
vt=(LinearLayout) findViewById(R.id.llv);
try this :
view row = LayoutInflater.from(this).inflate(R.layout.main, null);
LinearLayout layout=row.findViewById(R.id.YourLayout);
Check this to create Linear Layout Dynamically.
http://www.dreamincode.net/forums/topic/130521-android-part-iii-dynamic-layouts/

Categories

Resources