Programming for Everyone

Posted: **Tue Dec 03, 2024 12:39 pm**

#### Goal:
Develop an Android application that ensures the text in a `TextView` automatically scales to fit within the specified height and width.

---

#### Requirements:
1. Implement two approaches for auto-resizing text:
- Use the built-in `AutoSizeTextType` feature (API 26+).
- Create a custom class for auto-resizing text for devices running API < 26.

2. The implementation should consider:
- Maximum and minimum text size limits.
- Line count restrictions.
- Ensuring that the text is not clipped or truncated.

3. Ensure smooth resizing without visible "blinking" or excessive recalculations.

---

#### Steps to Complete:
1. **Set Up the Environment**:
- Use Android Studio to create a new project.
- Set the minimum SDK version to 19.

2. **Implement AutoSizeTextType**:
- Add a `TextView` in the layout using the attributes `android:autoSizeTextType`, `autoSizeMinTextSize`, `autoSizeMaxTextSize`, and `maxLines`.

3. **Develop a Custom AutoResizeTextView Class**:
- Create a class `AutoResizeTextView` extending `AppCompatTextView`.
- Implement a resizing algorithm that reduces the text size based on its height and width constraints.

4. **Test Both Approaches**:
- Verify the `AutoSizeTextType` functionality on devices running Android 8.0+.
- Test the custom `AutoResizeTextView` on devices running Android 4.4-7.1.

---

#### Evaluation Criteria:
1. The text fully fits within the bounds of the `TextView` regardless of size or line count.
2. The application performs efficiently without noticeable lag.
3. The functionality works correctly on both modern and older devices.

---

#### Bonus Task:
- Extend the functionality to allow dynamic text styling (e.g., bold, italic) without disrupting the auto-resizing logic.

Posted: **Tue Dec 03, 2024 12:43 pm**

### 1. **Using Built-in AutoSizeTextType** (API 26+)
Add the following XML code to your layout file:

```xml

Code: Select all

<TextView
    android:id="@+id/autoSizeTextView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="This is a sample text that should resize automatically."
    android:textSize="20sp"
    android:autoSizeTextType="uniform"
    android:autoSizeMinTextSize="12sp"
    android:autoSizeMaxTextSize="20sp"
    android:autoSizeStepGranularity="1sp"
    android:maxLines="3"
    android:ellipsize="end"
    tools:ignore="TextSizes" />

```

This enables automatic resizing with constraints such as:
- `autoSizeMinTextSize`: Minimum size of the text.
- `autoSizeMaxTextSize`: Maximum size of the text.
- `autoSizeStepGranularity`: The step by which the text size is reduced.

---

### 2. **Custom AutoResizeTextView Class** (for API < 26)

#### **Java Implementation**
```java

Code: Select all

import android.content.Context;
import android.util.AttributeSet;
import androidx.appcompat.widget.AppCompatTextView;

public class AutoResizeTextView extends AppCompatTextView {

    public AutoResizeTextView(Context context) {
        super(context);
    }

    public AutoResizeTextView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public AutoResizeTextView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @Override
    protected void onTextChanged(CharSequence text, int start, int lengthBefore, int lengthAfter) {
        super.onTextChanged(text, start, lengthBefore, lengthAfter);
        resizeText();
    }

    private void resizeText() {
        int width = getWidth();
        int height = getHeight();

        if (width <= 0 || height <= 0) {
            return; // Avoid resizing before the layout is measured
        }

        float textSize = getTextSize(); // Current text size
        CharSequence text = getText();

        // Start reducing the text size
        while (textSize > 12 && (isTextOverflowing(width, height, textSize))) {
            textSize -= 1;
            setTextSize(textSize);
        }
    }

    private boolean isTextOverflowing(int width, int height, float textSize) {
        // Measure the text with the current text size
        setTextSize(textSize);
        measure(MeasureSpec.makeMeasureSpec(width, MeasureSpec.EXACTLY),
                MeasureSpec.makeMeasureSpec(height, MeasureSpec.AT_MOST));

        // Check if the measured height exceeds the TextView height
        return getMeasuredHeight() > height || getLineCount() > getMaxLines();
    }
}

```

#### **Kotlin Implementation**
```kotlin

Code: Select all

import android.content.Context
import android.util.AttributeSet
import androidx.appcompat.widget.AppCompatTextView

class AutoResizeTextView @JvmOverloads constructor(
    context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0
) : AppCompatTextView(context, attrs, defStyleAttr) {

    override fun onTextChanged(text: CharSequence?, start: Int, lengthBefore: Int, lengthAfter: Int) {
        super.onTextChanged(text, start, lengthBefore, lengthAfter)
        resizeText()
    }

    private fun resizeText() {
        val width = width
        val height = height

        if (width <= 0 || height <= 0) return

        var textSize = textSize // Current text size
        val text = text ?: return

        while (textSize > 12 && isTextOverflowing(width, height, textSize)) {
            textSize -= 1
            setTextSize(textSize)
        }
    }

    private fun isTextOverflowing(width: Int, height: Int, textSize: Float): Boolean {
        setTextSize(textSize)
        measure(MeasureSpec.makeMeasureSpec(width, MeasureSpec.EXACTLY),
                MeasureSpec.makeMeasureSpec(height, MeasureSpec.AT_MOST))

        return measuredHeight > height || lineCount > maxLines
    }
}

```

---

### 3. **Usage in Layout**
Replace your `TextView` with `AutoResizeTextView` in your XML file:

```xml

Code: Select all

<com.example.customviews.AutoResizeTextView
    android:id="@+id/customTextView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="This text should resize dynamically for older Android versions."
    android:maxLines="3"
    android:textSize="20sp"
    android:ellipsize="end" />

```

---

### 4. **Testing**
- Use devices/emulators with Android versions 4.4 to 13.
- Verify that the text scales correctly for both approaches and stays within bounds.

Posted: **Tue Dec 03, 2024 12:48 pm**

### 5. **Improvements**

#### A. **Performance Optimization**
If resizing is causing noticeable lag, you can optimize by caching text measurements:
1. Add a `HashMap` to store pre-measured text sizes.
2. Only re-measure if the content or view dimensions change.

#### Code Example:
```java

Code: Select all

private Map<String, Float> sizeCache = new HashMap<>();

private void resizeText() {
    String key = getText().toString() + "_" + getWidth() + "_" + getHeight();
    if (sizeCache.containsKey(key)) {
        setTextSize(sizeCache.get(key));
        return;
    }

    float textSize = getTextSize();
    while (textSize > 12 && isTextOverflowing(getWidth(), getHeight(), textSize)) {
        textSize -= 1;
        setTextSize(textSize);
    }
    sizeCache.put(key, textSize);
}

```

---

#### B. **Dynamic Adjustment**
Allow dynamic resizing when the parent layout or device orientation changes. Override `onSizeChanged`:

```java

Code: Select all

@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
    super.onSizeChanged(w, h, oldw, oldh);
    resizeText(); // Re-trigger resizing when dimensions change
}

```

---

### 6. **Testing Edge Cases**
1. **Extreme Text Lengths**: Use very long and very short text to ensure resizing works correctly.
2. **Orientation Changes**: Rotate the device to confirm that resizing adapts dynamically.
3. **Small Container Sizes**: Test with minimal `TextView` dimensions to ensure no clipping.
4. **Large Fonts**: Start with very large text to verify proper downscaling.

---

### 7. **Bonus Features**

#### A. **Animation During Resizing**
Enhance user experience by animating text size changes:
```java

Code: Select all

ValueAnimator animator = ValueAnimator.ofFloat(currentSize, targetSize);
animator.addUpdateListener(animation -> setTextSize((float) animation.getAnimatedValue()));
animator.setDuration(300); // 300ms animation
animator.start();

```

#### B. **Ellipsize for Extra Long Text**
Ensure `ellipsize="end"` is used for text that cannot fit even at the smallest size. This can be enforced programmatically:
```java

Code: Select all

if (isTextOverflowing(getWidth(), getHeight(), 12)) {
    setEllipsize(TextUtils.TruncateAt.END);
}

```

---

### 8. **Alternative Libraries**
If you want a robust and pre-built solution, consider using libraries like [AutofitTextView](https://github.com/grantland/android-autofittextview), which offers:
- Seamless resizing.
- Compatibility across APIs.
- Minimal setup effort.

Programming for Everyone

Autosizing TextView

Autosizing TextView

Re: Autosizing TextView

Re: Autosizing TextView