I have a RecyclerView which consists of CardViews that have a TextView and an ImageView, among some other layouts.
The problem is, in some screen resolutions the TextView gets cut off or shoved to the next line, which I don't want.
In other resolutions, the TextView has plenty of room.
Small Resolutions:
High Resolutions:
How do I organize the layout so that there is enough room for the TextView, and the ImageView will be sized accordingly?
This is my xml for the RecyclerView items:
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android" xmlns:cardview="http://schemas.android.com/apk/res-auto" android:id="@+id/zmanCard" android:layout_width="match_parent" android:layout_height="50dp" android:layout_gravity="center_horizontal" android:gravity="center_horizontal" cardview:cardUseCompatPadding="false" cardview:cardPreventCornerOverlap="false" cardview:cardCornerRadius="4dp" cardview:cardElevation="2dp"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:background="?attr/colorPrimary" android:orientation="vertical"> <LinearLayout android:layout_width="match_parent" android:layout_height="20dp" android:layout_gravity="top" android:gravity="center" android:orientation="vertical" android:background="?attr/colorPrimaryDark"> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:id="@+id/zmanCardTitle" android:textColor="#ffffff" android:gravity="center" android:textSize="13sp" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal"> <ImageView android:layout_width="24dp" android:layout_height="wrap_content" android:layout_marginTop="2dp" android:layout_marginLeft="2dp" android:layout_marginRight="4dp" android:alpha="0.8" android:id="@+id/zmanCardImage" /> <FrameLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="7dp" android:layout_marginLeft="0dp" android:layout_marginRight="4dp"> <TextView android:text="5:40" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="2dp" android:id="@+id/zmanCardTime" android:textColor="#ffffff" android:textSize="18sp" /> <ProgressBar android:id="@+id/zmanProgressBar" android:layout_width="24dp" android:layout_height="24dp" android:layout_gravity="top|left" style="@style/Base.Widget.AppCompat.ProgressBar" /> </FrameLayout> </LinearLayout> </LinearLayout> 9 Answers
Answers 1
Try this. Works 100%.
AutoResizeTextView or sdp unit can help you.
SDP - a scalable size unit
An android SDK that provides a new size unit - sdp (scalable dp). This size unit scales with the screen size. It can help Android developers with supporting multiple screens.
for text views please refer to ssp which is based on the sp size unit for texts.
Answers 2
I can suggest two step solution one for your text size so with wrap_content attribute it gets fit to text and I suggest using a qualifier to provide several alternative layouts to target different screen configurations. You do so by using configuration qualifiers, which allows the run-time to automatically select the appropriate resource based on the current device’s configuration (such as a different layout design for different screen sizes). Supporting Different Screen Sizes
I think you need to check this Google IO Pdf for Design. In that pdf go to Page No:77 in which you will find how there suggesting for using dimens.xml for different devices of android for example see below structure:
res/values/dimens.xml
res/values-small/dimens.xml
res/values-normal/dimens.xml
res/values-large/dimens.xml
res/values-xlarge/dimens.xml
for Example you have used below dimens.xml in values.
<?xml version="1.0" encoding="utf-8"?> <resources> <dimen name="text_size">18sp</dimen> </resources> In other values folder you need to change values for your text size.
for example:
<resources> <!-- Default screen margins, per the Android Design guidelines. --> <dimen name="activity_horizontal_margin">16dp</dimen> <dimen name="activity_vertical_margin">16dp</dimen> <dimen name="font_size_small">10sp</dimen> <dimen name="font_size_medium">20sp</dimen> <dimen name="font_size_large">30sp</dimen> </resources> Answers 3
A TextView that automatically resizes text to fit perfectly within its bounds.
Usage:
dependencies { compile 'me.grantland:autofittextview:0.2.+' } Enable any View extending TextView in code:
AutofitHelper.create(textView); Enable any View extending TextView in XML:
<me.grantland.widget.AutofitLayout android:layout_width="match_parent" android:layout_height="wrap_content" > <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:singleLine="true" /> </me.grantland.widget.AutofitLayout> Use the built in Widget in code or XML:
<RootElement xmlns:autofit="http://schemas.android.com/apk/res-auto" ... <me.grantland.widget.AutofitTextView android:layout_width="match_parent" android:layout_height="wrap_content" android:singleLine="true" android:maxLines="2" android:textSize="40sp" autofit:minTextSize="16sp" /> Reference Link : https://github.com/grantland/android-autofittextview
Answers 4
If you want scalable screens, You shouldn't use fixed height or width as much as possible. In your case, you should place your components proportionately with layout_weight.
For more details;
Answers 5
For more simple way create your layout using relative layout with some proper technic sure it will resolve. if still haveing issue ask me for .xml file
Answers 6
You should use padding so that textview always has some fixed padding and it never gets cut. In your code make following changes
<TextView android:text="5:40" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="2dp" android:id="@+id/zmanCardTime" android:textColor="#ffffff" android:padding:"3dp" android:textSize="18sp" /> Answers 7
try giving weight to the textview layout and imageview layout give weight 1 to both layouts
Answers 8
Use AutoScaleTextView
The AutoScaleTextView takes the android:textSize value and uses it as the preferred text size. You can also set the minimum text size. The default for the minimum text size is 10dp. The AutoScaleTextView now tries to take the maximum value between the preferred and minimum size that fits into the Views width (with regarding the padding).
Please find full AutoScaleTextView class and its implementations in below LINK
Answers 9
My experience in android I always use dp instead of sp, so u fix the dp value for all your textviews and will fit anyscreen.
Let me know if any issue.
Best Regds
0 comments:
Post a Comment