Develop Reference

Listview in dialog with header and footer

I have a listview in my dialog and then I have to use the header layout and footer layout. the way I am doing it , aligning my header layout to top and the footer layout to bottom . but it has a problem. take a look at below picture ..
But by doing that the dialog gets Longer in size which is not expected
I am traped in this situation. Well If i align my footer with the listview end then the footer gets out of the screen. which is also not expected.
What I want :
I want that My listview should be visible in the center of dialog with the header layout align top and the footer layout align to the bootm of the dialog botttom border and it should not take the full length of the screen.
Isnt there a way to align the footer to the bottom of the dialog and dialog it self maintain its height (Note: I do not want to give the dialog hard coded height as I want the dialog to be look same on all devices. )
Please help I am stuck in the situation. If we look at the google dialog whcih comes while installing the app, it has short dialog with the listview in center of it and buttons are aligning to bottom of the dialog. How they are doing it?

Here's the dynamic solution for your problem..
Sample dialog xml file name activity_list_test.xml..
<?xml version="1.0" encoding="utf-8"?><LinearLayout 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"
android:background="#color/page_bg"
android:orientation="vertical">
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Header Button" />
<ListView
android:id="#+id/lvCommon"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Bottom Button" /></LinearLayout>`
Here's the calling from a fragment/activity where you want..
private void showAlert() {
AlertDialog.Builder dialog = new AlertDialog.Builder(getActivity());
View view = LayoutInflater.from(getActivity()).inflate(R.layout.activity_list_test, null);
dialog.setView(view);
dialog.setTitle(null);
dialog.setMessage(null);
ArrayList<String> mList = new ArrayList<>();
for (int i = 0; i < 15; i++) {
mList.add("ABC");
}
ListView lvCommon = (ListView) view.findViewById(R.id.lvCommon);
int deviceHeight = getScreenSize(getActivity()).y;
LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, deviceHeight / 3,1f);
lvCommon.setLayoutParams(layoutParams);
lvCommon.setAdapter(new ArrayAdapter<>(getActivity(), android.R.layout.simple_list_item_1, mList));
dialog.setCancelable(false);
dialog.show();
}
There device height will be auto measure and according to it the dialog size will be "deviceheight/3"..so it will be maintain in all devices..
Now you need the method getScreenSize..So here's it is::
public static Point getScreenSize(Activity act) {
int screenWidth = 0;
int screenHeight = 0;
final DisplayMetrics metrics = new DisplayMetrics();
act.getWindowManager().getDefaultDisplay().getMetrics(metrics);
screenWidth = metrics.widthPixels;
screenHeight = metrics.heightPixels;
return new Point(screenWidth, screenHeight);
}

You can set layout to your Dialog like below way
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView android:id="#+id/header_txt"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Header Text"
android:gravity="center|top"/>
<ListView android:id="#+id/listView"
android:layout_width="match_parent"
android:layout_height="200dp"
android:gravity="center_vertical/>
<TextView android:id="#+id/footer_txt"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Footer Text"
android:gravity="center|bottom"/>
</LinearLayout>
It will set Header View to Top,ListView to Center and Footer View to Bottom

You can try this one,.. create one xml and copy paste this code and set your dialog xml
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:paddingBottom="8dp"
android:paddingTop="8dp"
android:layout_marginTop="10dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ff0000"
android:gravity="center"
android:orientation="vertical"
>
<RelativeLayout
android:id="#+id/table_rl"
android:padding="10dp"
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="0dp"
android:orientation="vertical">
<TextView
android:id="#+id/your_items_tv"
android:textColor="#color/text_black"
customFontPath="lato_black.ttf"
android:layout_gravity="center"
android:gravity="center"
android:layout_marginTop="20dp"
android:text="HEADING"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<LinearLayout
android:layout_below="#+id/your_items_tv"
android:paddingBottom="5dp"
android:layout_marginTop="10dp"
android:paddingTop="5dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:textColor="#color/text_black"
customFontPath="lato_bold.ttf"
android:layout_gravity="center"
android:gravity="left"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:text="TOP BAR"/>
</LinearLayout>
<ListView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"></LinearLayout>
</RelativeLayout>
<LinearLayout
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_below="#+id/table_rl"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ff00ff">
<TextView
android:padding="5dp"
android:textSize="18dp"
android:textColor="#color/text_black"
customFontPath="lato_bold.ttf"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:text="Bottom Bar "/>
</LinearLayout>
</LinearLayout>
</LinearLayout>

View not showing in a relative layout in Android [duplicate]

This question already has answers here:
A view does not show inside a relative layout
(4 answers)
Closed 8 years ago.
I posted this already but i got new information that may help you to help me...
I have a problem with this layout and i cannot find out what is wrong. As you can see, there is a chronometer and a table inside a relative layout but the chronometer does not show, not even a blank space.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/firstLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<Chronometer
android:id="#+id/chrono"
android:textColor="#4169E1"
android:textSize="20sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="Chronometer"
/>
<TableLayout
android:id="#+id/parentLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
</TableLayout>
</RelativeLayout>
So i tried changing the order of the chronometer and tablelayout. I tried also changing the layout_width and layout_height properties, but i got nothing. So i went to my java class and i found out that the issue might be here:
private final void createGameBoard(short gridSize) {
DisplayMetrics metrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(metrics);
TableLayout tableLayout;
tableLayout = (TableLayout) findViewById(R.id.parentLayout);
tableLayout.removeAllViews();
board = GameBoard.createGameBoard(this,
bitmap,
tableLayout,
(int) (metrics.widthPixels * metrics.density),
(int) ((metrics.heightPixels * metrics.density)-h1),
gridSize);
}
where GameBoard.createGameBoard is:
public static GameBoard createGameBoard(Context context,
Bitmap bitmap,
TableLayout parentLayout,
int width,
int height,
short gridSize) {
board = new GameBoard(context,
bitmap,
parentLayout,
width,
height,
gridSize);
return board;
}
So i guess that the problem displaying the chronometer comes from the creation of the gameboard, because of the metrics taken from the current window, which is used to set the height of the gameboard.
any suggestions?

Your xml code:
<Chronometer
android:id="#+id/chrono"
android:textColor="#4169E1"
android:textSize="20sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="Chronometer"
/>
<TableLayout
android:id="#+id/parentLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
This will force TableLayout to be shown in full screen and so, Chronometer is being hidden.
Try changing like one of followings:
1.)
<Chronometer
android:id="#+id/chrono"
android:textColor="#4169E1"
android:textSize="20sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="Chronometer"
/>
<TableLayout
android:id="#+id/parentLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
Which will wrap content of table, so Chronometer will get space.
2.)
<Chronometer
android:id="#+id/chrono"
android:textColor="#4169E1"
android:textSize="20sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="Chronometer"
/>
<TableLayout
android:id="#+id/parentLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/chrono"
>
This will force Chronometer to take full space below table layout after table layout is shown.
Hope this helps.

weights inside a scrollview [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 3 years ago.
Improve this question
In my App i am trying to create a scroll view that has 3 big buttons that fills the entire screen. so every button's size is 1/3 of the screen. How can I do that?
When I am using weights its not working .
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/imageView2"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_below="#+id/header_layout" >
<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal" >
<TableRow
android:id="#+id/tableRow1"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center_horizontal" >
<ImageView
android:id="#+id/imageView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/main_btn_call" />
</TableRow>
<TableRow
android:id="#+id/tableRow2"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center_horizontal" >
<ImageView
android:id="#+id/imageView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/main_btn_unlock" />
</TableRow>
<TableRow
android:id="#+id/tableRow3"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center_horizontal" >
<ImageView
android:id="#+id/imageView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/main_btn_push" />
</TableRow>
</TableLayout>
</ScrollView>

The only change is add the following property in your XML:
android:fillViewport="true"
and your scroll view width and height should be match_parent
android:layout_width="match_parent"
android:layout_height="match_parent"

You're using TableLayout which is a LinearLayout with orientation set to vertical - This is all fine so far, you using weights on the layout_height attribute.
The problem as I see it is that you're using wrap_content in both your ScrollView and in your TableLayout. Weight values allow your views to expand to fill space available to it but your parent is wrapping the content to 0 + 0 + 0. If you change the hight to match_parent for both parent elements your weight values will have space to expand

I meneged to do this with code:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final ImageView incallImage = (ImageView) findViewById(R.id.incall_image);
final ImageView unlockImage = (ImageView) findViewById(R.id.unlock_image);
final ImageView pushImage = (ImageView) findViewById(R.id.push_image);
final ScrollView scrollViewMain = (ScrollView) findViewById(R.id.scroll_view_main);
scrollViewMain.post(new Runnable() {
#Override
public void run() {
scrollMainHeight = scrollViewMain.getHeight();
LinearLayout.LayoutParams layoutParams = new
LinearLayout.LayoutParams(LayoutParams.MATCH_PARENT, scrollMainHeight / 3);
incallImage.setLayoutParams(layoutParams);
unlockImage.setLayoutParams(layoutParams);
pushImage.setLayoutParams(layoutParams);
}
});
}
If anyone finds a way to do this in the xml it will be great!,
Thanks!

android gridview row dividers / separators

Is there a way to show (horizontal) dividers between rows in a gridview?
I tried putting a small divider-image below every grid item, but this is not a solution, because it won't span the whole row when a row is not completely filled with items.
Is there a way to just add an image between every row? I can only find methods for changing the space between rows.

If you are using custom layout for grid items. Below code will work.
Step 1: Give background color to GridView
This is going to serve as a divider.
Give horizontalSpacing and verticalSpacing as 1dp
backgroundColor will be your divider color.
<GridView
android:id="#+id/gridView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#e5e5e5"
android:horizontalSpacing="1dp"
android:numColumns="auto_fit"
android:stretchMode="columnWidth"
android:verticalSpacing="1dp" >
Step 2: Give background color to Custom Grid Item Layout
This is going to serve as a foreground color for GridItems.
In my case I kept it white (#fff)
<?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"
android:gravity="center"
android:background="#fff"
android:padding="15dp"
>
<ImageView
android:id="#+id/icon"
android:layout_width="50dp"
android:layout_height="50dp"
android:src="#drawable/ic_launcher_transparent" />
<TextView
android:id="#+id/lable"
android:layout_marginTop="5dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Medium Text"
android:textStyle="bold"
android:textColor="#D0583B"
android:textAppearance="?android:attr/textAppearanceSmall" />
</LinearLayout>
Result
Note:
If you do not want vertical separator, keep horizontalSpacing = 0dp
If you do not want horizontal separator, keep verticalSpacing = 0dp

I ended up creating a custom gridview, something like this:
https://stackoverflow.com/a/9757501/1310343
using a background image that is exactly as high as one item in my gridview, and has a devider at the bottom.
Works like a charm!

Just wanted to share how I implemented this using the link accepted by OP.
For my case I also needed to control the length of the separators, so I couldn't get around subclassing GridView.
public class HorizontalSeparatorGridView extends GridView {
// Additional methods
#Override
protected void dispatchDraw(Canvas canvas) {
final int count = getChildCount();
for(int i = 0; i < count; i++) {
View child = getChildAt(i);
int bottom = child.getBottom();
int left = child.getLeft();
int right = child.getRight();
Paint paint = new Paint();
paint.setColor(0xffececec);
paint.setStrokeWidth(Math.round(0.5 * density));
int offset = // Some offset
canvas.drawLine(left + offset, bottom, right - offset, bottom, paint);
}
super.dispatchDraw(canvas);
}
I subclassed dispatchDraw as opposed to onDraw just to be safe but I don't think it would matter in this case.

I suggest doing the following:
`
<TableRow
android:id="#+id/tableRow1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="1sp"
android:layout_marginLeft="7sp"
android:layout_marginRight="7sp"
android:layout_marginTop="7sp"
android:background="#android:color/transparent">
<TextView
android:id="#+id/lblDeposit"
android:layout_width="60sp"
android:layout_height="40sp"
android:layout_gravity="center_vertical"
android:layout_marginLeft="0sp"
android:background="#drawable/rounded_top_left_rectangle"
android:gravity="center"
android:paddingLeft="5sp"
android:scaleType="fitXY"
android:text="Deposit"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#000">
</TextView>
<TextView
android:id="#+id/lblDepositvalue"
android:layout_width="50sp"
android:layout_height="40sp"
android:layout_gravity="center_vertical"
android:layout_marginLeft="2sp"
android:layout_marginRight="13sp"
android:background="#drawable/rounded_top_right_rectangle"
android:gravity="center_vertical|center_horizontal"
android:scaleType="fitXY"
android:text="40000/-Rs"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#000">
</TextView>
</TableRow>
<TableRow
android:id="#+id/tableRow2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="6sp"
android:layout_marginLeft="7sp"
android:layout_marginRight="7sp"
android:layout_marginTop="2sp"
android:background="#android:color/transparent">
<TextView
android:id="#+id/lblPoints"
android:layout_width="60sp"
android:layout_height="40sp"
android:layout_gravity="center_vertical"
android:layout_marginLeft="0sp"
android:background="#drawable/rounded_bottom_right_rectangle"
android:gravity="center"
android:paddingLeft="5sp"
android:scaleType="fitXY"
android:text="Points "
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#000">
</TextView>
<TextView
android:id="#+id/lblPointsValue"
android:layout_width="50sp"
android:layout_height="40sp"
android:layout_gravity="center_vertical"
android:layout_marginLeft="2sp"
android:layout_marginRight="13sp"
android:background="#drawable/rounded_bottom_left_rectangle"
android:gravity="center_vertical|center_horizontal"
android:scaleType="fitXY"
android:text="20"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#000">
</TextView>
</TableRow>
</TableLayout>`

android RelativeLayout, equal spacing?

I'm using Relative Layout to create a calculator screen, and i have a row of buttons labeled 1, 2, and 3. I want them evenly spaced, but i'm not sure how to do this with Relative Layout
I'm used to using the android:layout_weight function in LinearLayout, and give each of them a value of android:layout_width="fill_parent", as well as a layout_weight="1"
any way to get this to happen on calculator screen (without specifying DP or PX)
this is what i have set up at the moment, and they are aligned in order from left to right, under the TextView (calculator output screen). any suggestions/solutions to evenly space, filling the width of the screen?
<TextView
android:id="#+id/textView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/edit_text"
android:layout_margin="6px"
/>
<Button
android:id="#+id/button1"
android:text="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/textView"
/>
<Button
android:id="#+id/button2"
android:text="2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/textView"
android:layout_toRightOf="#+id/button1"/>
<Button
android:id="#+id/button3"
android:text="3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/textView"
android:layout_toRightOf="#+id/button2"
/>

If you want equal spacing, you do not want a RelativeLayout. Use a LinearLayout, as you suggest in your question. If needed, put the Buttons in a LinearLayout and put the LinearLayout in the RelativeLayout.

The easiest would be to manipulate the view during OnCreate().
Something like:
OnCreate(Context ctx){
int w = getWidth();
int h = getHeight();
Button B1 = findViewById(R.id.button1);
B1.setWidth(w/3);
--repeat for button2,3 textview--
}
Another option would be to use a TableLayout where you stretch the columns and force the buttons to fill parent. This would require you to use
<TableLayout android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:stretchColumns="0,1,2"
android:layout_below="#+id/textView">
<TableRow><Button
android:id="#+id/button1"
android:text="1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/><Button
android:id="#+id/button2"
android:text="2"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>
</TableRow>
</TableLayout>