Android Studio grid view overlapping? - java

I am trying to recreate the look below, however I am struggling to get the gridview to act correctly. For some reason the images are overlapping one another and I cant seem to create the appropiate padding between each tile. I have added the GridView code below.
<GridView
android:id="#+id/containerProfileGridView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:verticalSpacing="0dp"
android:clipToPadding="false"
android:stretchMode="columnWidth"
android:numColumns="auto_fit"
android:clickable="true"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:horizontalSpacing="5dp">
</GridView>

Please add android:verticalSpacing in GriwView which defines the default vertical spacing between rows. Have a look in Android Doc GridView

Related

Element of listview out of bounds(visually) because of round edges

I am making an android app using Java in android studio. I have defined drawable background for listview with round edges. But last shown row is visually out of listview container. It is not just the line separating it from next record but also "-" symbol can be halfway out of the container. The app looks like this
is there a way to keep content inside the bounds?
It's happening bcz your background is different to listview and list view is always a square layout.
So basically, use cardview and set app:cardCornerRadius="" to cardview and list view set inside of cardview.
like this.
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardCornerRadius="10dp"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="YOUR_BACKGROUND"
/>
<ListView
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
</RelativeLayout>
</androidx.cardview.widget.CardView>
OR
The other option is to use a round corner layout.
Git link
and set list view inside of any RoundCornerLayout.

How to make a layout in android that sticks to the bottom of the screen until the scrollview is scrolled to a certain position it gets scroll too?

I want to make a android activity screen where a layout is sticked to bottom until scrollview get scroll to a certain position. like in this video samples links:
https://drive.google.com/open?id=0B14wNBitoI33LWtUNThqcXRIUWc
https://drive.google.com/open?id=0B14wNBitoI33QW1BOGR1di1TcGc
amarjain07's StickyScrollView maybe a solution you would want to look into. His methodology of assigning the "sticky" views as identified attributes in the layout xml is quite a nifty feature IMHO.
Use a RelativeLayout and put the Button-Container inside it.
Pass the container in your_scrollview_activity.xml the following attribute
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true">
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button 1 (reft)" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button 2 (right)"/>
</LinearLayout>
</RelativeLayout>
NOTE: You need to set a listener in your activity to get the ScrollViews current position / current height. With this current height you can calculate the "left space" to the bottom / end of the ScrollView. If your RelativeLayout reaches the bottom or if it's close to the bottom AND within the visible area, then call your animation.

android custom round layout

I want to make something like the image in the link, so I've two tabs at the bottom and a round button in the middle in front of these tabs, and a fragment that in the image is the blue background.
So I can make the tabs and the fragment just fine. but how can I put the round button in front of the tabs and the fragment?
Check this image
thanks
By using FrameLayout
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView
android:src="#drawable/ic_launcher"
android:layout_height="200dp"
android:layout_width="200dp"/>
<Button
android:text="Frame"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:gravity="center"/>
</FrameLayout>
Now button is in front of The Image.
You can add layout_marginTop attribute to the view you would want to be in front of the Fragment. Example
<ImageView
android:src="#drawable/ic_launcher"
android:layout_height="200dp"
android:layout_width="200dp"
android:layout_marginTop="-100dp"/>
This will move the ImageView 100dp upwards in front of the Fragment. Hope it helps

android:gravity="right" not working on all devices for Arabic and other RTL languages

I've got an Arabic Android application, and here is the XML code:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/greygradientbackground">
<ImageView android:id="#+id/logo"
android:layout_width="150dp"
android:layout_height="fill_parent"
android:scaleType="centerCrop"
android:layout_margin="5dp"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true" />
<TextView android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="16sp"
android:textColor="#000000"
android:layout_gravity="center_vertical|right"
android:gravity="right"
android:layout_toLeftOf="#id/logo"/>
</RelativeLayout>
The problem is that android:gravity works on some Android models and on others don't.
To be more specific, I've tested the app on many 2.3.3 android devices and the Arabic text is aligned right. However on other 2.3.3 devices the Arabic text is aligned left (which is wrong).
When I changed android:gravity="right" to android:gravity="left" the problem shifted from the second group of devices to the first.
So my question is how can I solve this issue especially that as far as I know there aren't a way to localize layouts based on a device model number.
Thanks in advance for any guidance because am totally lost. :(
UPDATE:
I searched about "How to align Arabic correctly on all Android versions?" but found nothing working on all my testing devices. Any suggestions please? I am sure there is a best practice approach for aligning Arabic text on Android.
UPDATE 2:
I tried to use a WebView instead of a TextView to align Arabic correctly using CSS styles. However, the Arabic text is showing in the WebView as strange characters.
Here is the Code:
mWebView.loadData("<html dir=\"rtl\">الأسم<body></body></html>", "text/html", "UTF-8");
The strange thing is that Arabic websites text is displayed correctly. So, what's the problem? :(
This is an expected behaviour. You may not use gravity="right", but gravity="end" instead, the same idea you apply to gravity="left" which you may use gravity="start", as well as layout_marginStart instead of layout_marginLeft
This way, Android will put the text to the "start" orientation, depending on the location. (for us, americans, we start to write from the left and we end on the right, but arabians start from the right and end on the left).
You can get the layout/text directions with the method getLayoutDirectionFromLocale(null), this will return View.LAYOUT_DIRECTION_LTR (left-to-right) or View.LAYOUT_DIRECTION_RTL (right-to-left, like arabic).
More info you can check here
change your textveiw in the layout to this....
<TextView android:id="#+id/title"
change your layout_width to "fill_parent"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textSize="16sp"
android:textColor="#000000"
android:layout_gravity="center_vertical|right"
android:gravity="right"
android:layout_toLeftOf="#id/logo"
/>
You can change the thing in another way also....You can make changes in the activity class..as follows...let your TextView with id title is mapped in the activity class with a TextView object named "tv" the you can make it right aligned by writing this.
tv.setGravity(Gravity.RIGHT);
but in both the cases the width layout width should be "fill_parent"..
If you do not do this and keep it "wrap_content" then there is no space for the text to move... all the alignments (center,left,right...)remain the same.....
If both of these donot work out... then I would prefer you to use table layout and keep the text view in it....
try putting your textview inside a separate LinearLayout ,and set that layouts properties likethis:
android:layout_gravity="center_vertical" and android:orientation="vertical"
android:gravity="right"
note: dont specify layout_gravity of the textview.
hope this helps! it worked fine for me.
also you can try the solution provided here: Android Arabic text aligment
Another solution to achieve such behavior:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layoutDirection="ltr"
android:layout_weight="1"
android:gravity="end"
android:padding="16dp"
android:text="#string/locale_switch_btn" />
</LinearLayout>
Note that, for correct gravity="end" alignment, in rtl locales you should set property:
android:layoutDirection="ltr"

How to set a fixed size for ListView that is laid inside a Dialog and elements are added dynamically

I am trying to include a ListView within an Activity that is running inside a Dialog. The dialog is basically used to search for bluetooth devices, so I need two Button's, a TextView and a ListView. Here is my 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"
android:padding="20dp">
<TextView
android:text="Bluetooth List"
android:paddingTop="15dp"
android:textAppearance="?android:attr/textAppearanceMedium"
android:layout_height="wrap_content"
android:layout_width="wrap_content">
</TextView>
<ListView android:id="#+id/bluetoothPanel_lvBluetooth"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_margin="10dip"
android:drawSelectorOnTop="false">
</ListView>
<LinearLayout
android:orientation="horizontal"
android:paddingLeft="4.0dip"
android:paddingTop="5.0dip"
android:paddingRight="4.0dip"
android:paddingBottom="1.0dip"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/bluetoothPanel_btnSearch"
android:layout_width="0.0dip"
android:layout_height="fill_parent"
android:text="Search"
android:layout_weight="1.0" />
<Button
android:id="#+id/bluetoothPanel_btnCancel"
android:layout_width="0.0dip"
android:layout_height="fill_parent"
android:text="Cancel"
android:layout_weight="1.0" />
</LinearLayout>
</LinearLayout>
At the beginning, the ArrayAdapter that is within the ListView is empty, and I am dynamically add elements to it.
The problem is, I want to set a fixed size for the ListView so that it won't change its size upon adding elements dynamically (List of bluetooth devices are shown). Could you please help me to fix my XML?
EDIT:
I am not talking about array size. I am talking about the listview itself (the view), the height of the listview.
Set a custom ListAdapter for the list and override the getCount() method so it returns always your fixed size.
Example: http://jnastase.alner.net/archive/2010/12/19/custom-android-listadapter.aspx
I think you are asking how to reserve a fixed-size space for a dynamically changing ListView. In a similar situation, I wrapped the ListView in a LinearLayout, as shown below. Note that this is the xml for the ListView itself, not for the cell contents. The fixed height in this example is 100dip x 200dip.
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="#drawable/background_image"
android:layout_width="100dip"
android:layout_height="200dip">
<ListView android:id="#+id/list_view"
android:layout_width="100dip"
android:layout_height="match_parent"
android:cacheColorHint="#00000000"
/>
</LinearLayout>
Notice that the layout_width of the ListView also is set to the desired fixed width. I'm not sure why, but this seems to be necessary.
Also notice that the background image or color is set on the LinearLayout, not on the ListView. Setting the ListView's cacheColorHint to transparent makes the ListView play nicely.
If you were asking something else (perhaps, for example, fixing the scrollable height regardless of elements, which seems to be answered by #Stephen), you may want to clarify the question.

Categories

Resources