AutoScale TextView (4.4버전 테스트완료)

출처 : http://ankri.de/autoscale-textview/

I was in need of a TextView that has a fixed with but dynamic content, so I needed the content to automatically scale.

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. TheAutoScaleTextView now tries to take the maximum value between the preferred and minimum size that fits into the Views width (with regarding the padding).

Here is the result:

The AutoScale TextView in action displaying the android version names

You can see that the AutoScaleTextView automatically scales the text to fit in the Views width. For the different views I used layout_width: 130dp and layout_height=30dp, textSize: 16dp and 10dp for the minTextSize. On the second Ice Cream Sandwich TextView I used 13dp for the minTextSizeand layout_height: wrap_content.

Get the source and explanation after the break.

The code itself is pretty simple. I improved a snippet I found on stackoverflow.com. I sadly cannot remember the exact post.

You can checkout the demo project: https://bitbucket.org/ankri/autoscaletextview/src

Or download the project: https://bitbucket.org/ankri/autoscaletextview/downloads

Please feel free to leave feedback or report bugs here:https://bitbucket.org/ankri/autoscaletextview/issues?status=new&status=open

Or view the code below:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108

package de.ankri.views;   import android.content.Context; import android.content.res.TypedArray; import android.graphics.Paint; import android.util.AttributeSet; import android.util.TypedValue; import android.widget.TextView; import de.ankri.R;   /** * A custom Text View that lowers the text size when the text is to big for the TextView. Modified version of one found on stackoverflow * * @author Andreas Krings - www.ankri.de * @version 1.0 * */ public class AutoScaleTextView extends TextView {     private Paint textPaint;       private float preferredTextSize;     private float minTextSize;       public AutoScaleTextView(Context context)     {         this(context, null);     }       public AutoScaleTextView(Context context, AttributeSet attrs)     {         this(context, attrs, R.attr.autoScaleTextViewStyle);           // Use this constructor, if you do not want use the default style         // super(context, attrs);     }       public AutoScaleTextView(Context context, AttributeSet attrs, int defStyle)     {         super(context, attrs, defStyle);           this.textPaint = new Paint();           TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.AutoScaleTextView, defStyle, 0);         this.minTextSize = a.getDimension(R.styleable.AutoScaleTextView_minTextSize, 10f);         a.recycle();           this.preferredTextSize = this.getTextSize();     }       /**      * Set the minimum text size for this view      *      * @param minTextSize      *            The minimum text size      */     public void setMinTextSize(float minTextSize)     {         this.minTextSize = minTextSize;     }       /**      * Resize the text so that it fits      *      * @param text      *            The text. Neither <code>null</code> nor empty.      * @param textWidth      *            The width of the TextView. > 0      */     private void refitText(String text, int textWidth)     {         if (textWidth <= 0 || text == null || text.length() == 0)             return;           // the width         int targetWidth = textWidth - this.getPaddingLeft() - this.getPaddingRight();           final float threshold = 0.5f; // How close we have to be           this.textPaint.set(this.getPaint());           while ((this.preferredTextSize - this.minTextSize) > threshold)         {             float size = (this.preferredTextSize + this.minTextSize) / 2;             this.textPaint.setTextSize(size);             if (this.textPaint.measureText(text) >= targetWidth)                 this.preferredTextSize = size; // too big             else                 this.minTextSize = size; // too small         }         // Use min size so that we undershoot rather than overshoot         this.setTextSize(TypedValue.COMPLEX_UNIT_PX, this.minTextSize);     }       @Override     protected void onTextChanged(final CharSequence text, final int start, final int before, final int after)     {         this.refitText(text.toString(), this.getWidth());     }       @Override     protected void onSizeChanged(int width, int height, int oldwidth, int oldheight)     {         if (width != oldwidth)             this.refitText(this.getText().toString(), width);     }   }

The important part is the refitText(String, int) method. Note: If you are dealing with big textsizes you should set the treshold to a higher value.

Here is a snippet from the main.xml I used in the demo project

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30

<LinearLayout     xmlns:android="http://schemas.android.com/apk/res/android"     xmlns:app="http://schemas.android.com/apk/res/de.ankri"     android:layout_width="match_parent"     android:layout_height="match_parent"     android:orientation="vertical"     >       <!-- Here is one of the AutoScaleTextViews. Use android:textSize to set the preferred textsize. -->     <de.ankri.views.AutoScaleTextView         android:layout_width="@dimen/width"         android:layout_height="@dimen/height"         android:layout_gravity="center_horizontal"         android:text="@string/cupcake"         android:layout_margin="5dp"         android:textSize="16dp"         />       <!-- Demo how to alter the minimum text size. -->     <de.ankri.views.AutoScaleTextView         android:text="@string/ics"         android:layout_width="@dimen/width"         android:layout_height="wrap_content"         android:layout_gravity="center_horizontal"         android:layout_margin="5dp"         android:textSize="16dp"         app:minTextSize="13dp"         />           </LinearLayout>

The values from the res/values/dimens.xml are 100dp for the width and 30dp for the height.

The content of the res/values/attrs.xml to alter the minTextSize in the layout files is:

1 2 3 4 5 6 7 8

<?xml version="1.0" encoding="utf-8"?> <resources>     <!-- used to set the minTextSize via xml -->     <attr name="autoScaleTextViewStyle" format="reference" />     <declare-styleable name="AutoScaleTextView">         <attr name="minTextSize" format="dimension" />     </declare-styleable> </resources>

 

And the content of the res/values/styles.xml to set the default minTextSize or other default styles for the AutoScaleTextView

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17

<resources>     <!-- Use the device default light theme to activate the StatusBar on API 11+ devices -->     <style name="AppTheme" parent="android:Theme.DeviceDefault.Light">            <item name="de.ankri:autoScaleTextViewStyle">@style/autoScaleTextView</item>        </style>       <!-- Standard configuration for the AutoScaleTextView -->     <style name="autoScaleTextView">         <!-- some graphical improvements just for the demo. feel free to remove -->         <item name="@android:attr/background">@drawable/border</item>         <item name="@android:attr/padding">5dp</item>         <item name="@android:attr/gravity">center</item>           <!-- use the next line to alter the minimum text size (uncomment first)-->         <!-- <item name="@attr/minTextSize">10dp</item> -->     </style> </resources>

 

Have fun using the code. I uploaded the code under the Beerware License. You can take the code and do whatever you want with it, as long as you mention me somewhere in your code, or your final app. If we ever meet and you think that the code, or explanation was helpful, feel free to buy me a beer and have a chat.

Or you could help a fellow out by donating some money.

Updated licence

When I uploaded this code I never thought anyone would use it, but since some people actually are using it, I updated the licence to Apache 2.0. But still… If you’re in the mood to buy me a beer. Please do