Center GridView in Relative layout - java

I have simple layout:
<?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" >
<GridView
android:id="#+id/photo_browser_grid_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:gravity="center"
android:horizontalSpacing="5dp"
android:verticalSpacing="5dp"
android:stretchMode="none"
android:numColumns="auto_fit"
android:columnWidth="100dp">
</GridView>
I want to centre my GridView inside Relative layout. My spacing is always fixed. In result I have GridView aligned to left. How can I center it inside parent?

For GridView in the layout, android:numColumns="auto_fit" conflicts with android:layout_width="wrap_content". It means : to calculate how many columns to form, width is required, but to find width we need how many columns to wrap around, a circular dependency.
You can use android:stretchMode to let columns fill up empty space.

Related

Center ProgressBar inside RecyclerView that is inside ConstraintLayout

I have a ProgressBar that is an item of the RecyclerView and was added there with the adapter following this tutorial Android RecyclerView dynamically load more items when scroll to end with bottom ProgressBar.
But instead of using a RelativeLayout in the activity_main.xml file, I'm using the default ConstraintLayout. The problem for me is that the ProgressBar isn't centered.
Please find below the layouts I've described above:
The progress bar item
<?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="wrap_content"
android:orientation="vertical">
<ProgressBar
android:id="#+id/progressbar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal" />
</LinearLayout>
The activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="me.bookquotes.quotes.MainActivity">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:background="?attr/colorPrimary"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar" />
<android.support.v7.widget.RecyclerView
android:id="#+id/list"
android:layout_width="wrap_content"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#+id/toolbar"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent" />
</android.support.constraint.ConstraintLayout>
Below is a screenshot of the ProgressBar that appears on the left (I need it to be centered):
I've taken a closer look at your issue and it is not clear at all what is going on. I have taken the sample project and applied your changes to the layouts and it works just fine. (I did remove a tools reference and changed a couple of ids.)
Here is the GitHub project with the changes just to the two layouts above. Here is a video of this modified app that shows the progress bar in the center as expected.
I was thinking that this was a constraint issue but, as you can see from the demo, that is not the case.
It is also possible that this may be related to the version of ConstraintLayout you are running or some other configuration thing, so you may want to check that out. Otherwise, it looks like something else is going on that has not been revealed. Are you doing any other manipulation of the layout widgets?
It would be useful to know what in your layout is not lining up. Give the LinearLayout a background color to see if it stretching across the screen or not. That will tell you if the progress bar is misaligned or whether the LinearLayout is pinched.
One other possibility: Are you failing to name the parent in the inflation of the LinearLayout? Say something like this:
View view = LayoutInflater.from(activity).inflate(R.layout.item_loading, null, false);
instead of this
View view = LayoutInflater.from(activity).inflate(R.layout.item_loading, parent, false);
That small difference will shove your progress bar to the side.
You need to add gravity to your parent LinearLayout which sets the child's gravity to center.I have corrected the progressbar layout.
Hope this could help.
<?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="wrap_content"
android:gravity="center"
android:orientation="vertical">
<ProgressBar
android:id="#+id/progressbar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal" />
</LinearLayout>
Are you trying to center in middle of screen ?
Or just inside the linear layout
Try gravity instead of layout gravity which will try to center inside the linear layout instead of constraint layout. Since you already have match parent width on it . Also post code to show when you are adding the progress bar to the view .

Use multiple ImageViews as background

I'm currently working on an app for 2 'players', the layout contains the same controls on top and (rotated) bottom.
I use an image as background to display it for both players:
Blue represents player one, red represents player two. Grey is for settings.
I used this until now, but I want the players to be able to change their background color.
My attempt was to put imageViews in the background, containing the selected color. But how can I put them in the background so my other views won't be affected? And how can I add multiple of them? I thought I could add two ImageViews to my RelativeLayout, the first one taking up 45% of parent space from top, and the second one from the bottom. The background itself would be grey for the center (for example).
How can I achieve that?
How about this?
<?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/layout_center"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_centerVertical="true"
android:background="#android:color/darker_gray">
</LinearLayout>
<LinearLayout
android:id="#+id/layout_top"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/layout_center"
android:background="#android:color/holo_red_light">
</LinearLayout>
<LinearLayout
android:id="#+id/layout_bottom"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/layout_center"
android:background="#android:color/holo_blue_light">
</LinearLayout>
</RelativeLayout>

How to make Horizontally scrollable Grid View?

I am trying to make a Grid View and it has a lot of images. So I want to make it Horizontally scrollable, but it is not scrolling. How to make Horizontally scrollable Grid View ? Please help me.
Here is my code.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<HorizontalScrollView
android:id="#+id/horizontalScrollView1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:fillViewport="true"
android:scrollbars="horizontal" >
<GridView
android:layout_width="500dp"
android:layout_height="400dp"
android:id="#+id/gridview"
android:columnWidth="300dp"
android:numColumns="3"
android:horizontalSpacing="10dp"
android:scrollbars="horizontal">
</GridView>
</HorizontalScrollView>
</RelativeLayout>
I got the answer, and I am sharing here.
Just go on the following link:-
Link and just add this library into your project. After that just use the xml code at the place of Grid View code.
<com.jess.ui.TwoWayGridView
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/grid_viewlevel"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:gravity="center"
app:columnWidth="200dp"
app:rowHeight="200dp"
app:numColumns="15"
app:numRows="2"
app:verticalSpacing="0dp"
app:horizontalSpacing="0dp"
app:stretchMode="columnWidth"
app:scrollDirectionPortrait="horizontal"
app:scrollDirectionLandscape="horizontal"/>
After normally Just apply the following code in your java file.
TwoWayGridView scrollview;
scrollview = (TwoWayGridView) findViewById(R.id.grid_viewlevel);
mAdapter = new LevelAdapter(this, R.layout.levelselect);
scrollview.setAdapter(mAdapter);

LinearLayout minHeight not working with weigth="1"

I tried all afternoon to get the minHeight attribute to work.
What I want is the linearMe layout to:
Stretch from the bottom of the screen to the bottom of the ListView when the ListView has just a few elements.
I need to be able to fill the linearMe layout with a picture for example.
As the ListView gets bigger I want the linearMe layout to:
Have a fixed height (while being at the bottom of the screen) and the ListView to allow scrolling.
My problem is that the the linearMe layout is smaller and smaller as there is more elements in the ListView. And when there is enough element for the listView to fill the screen, the linearMe layout is just gone. It looks like the minHeight is useless in this case.
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent" >
<ListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<LinearLayout
android:id="#+id/linearMe"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#FF0000"
android:minHeight="200dp" />
</LinearLayout>
I hope you can help me out ! :)
Add android:layout_weight="1" to the ListView as well.
Change them both (list & linearMe) android:layout_height attribute to "match_parent"
Remove `minHeight.
That way each View will take half of the screen.`
You might want to try your spacer layout using "View" instead of "LinearLayout". The ViewGroup classes sometimes handle layouts slightly differently.
If you are willing to use ConstraintLayout as the parent container, the following xml should serve your purpose:
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constrainedHeight="true"
app:layout_constraintBottom_toTopOf="#id/linearMe"
app:layout_constraintTop_toTopOf="parent"
tools:listitem="#android:layout/list_content" />
<LinearLayout
android:id="#+id/linearMe"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#FF0000"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#id/list"
app:layout_constraintHeight_min="200dp"
android:orientation="vertical"
/>
</androidx.constraintlayout.widget.ConstraintLayout>
What I've done is that I've defined constraints to chain both list and linearMe with each other. app:layout_constraintHeight_min="200dp" will ensure minimum height of 200dp for linearMe. app:layout_constrainedHeight="true" makes sure that when list has more items, it doesn't hide behind linearMe.
I couldn't test it with some data to fill the ListView. You can just try it out and post your feedback here.

Center horizontally and/or vertically with 9 patch in Android

I can't find a topic talking about my problem which seems to me standard ... And that make me think it is not possible. But I give a try.
I have a RelativeLayout with a 9 patch background (which contain a content area).
Is that possible to center horizontally and/or vertically a TextView inside this RelativeLayout in relation to the content area ?
this layout file will do the task
<?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="fill_parent"
android:background="#drawable/background"
android:gravity="center" >
<TextView
android:id="#+id/txtTest"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Test TextView"
android:textColor="#000000" >
</TextView>
</RelativeLayout>
the 9-patch image i used is

Categories