4

Необходимо вписать текст в TextView ограниченный кругом. пример введите сюда описание изображения Подскажите, в какую сторону копать

8
  • 2
    есть на enSO такой же вопрос, может поможет stackoverflow.com/questions/11293866/… 25 янв 2016 в 13:39
  • а где можно найти реализацию onDraw(Canvas canvas); ?
    – miha_dev
    25 янв 2016 в 13:58
  • какая конечная задача? вам нужно текст произвольной длины закидывать в такое view?
    – IEVGEN
    25 янв 2016 в 17:01
  • onDraw(Canvas canvas) -- метод View, который вам перегрузить, скорее всего, придется
    – IEVGEN
    25 янв 2016 в 17:04
  • 1
    Если вам все еще интересно, я решил запилить библиотеку, которая будет делать, что вам нужно. У меня так же проблемы с алгоритмом ,поэтому я задал вопрос: ru.stackoverflow.com/questions/486523/… 27 янв 2016 в 7:45

3 ответа 3

7

Написал код onDraw(Canvas canvas) своего класса наследника TextViewрешающий задачу для меня. Комментарии описываю последовательность действий:

@Override
protected void onDraw(Canvas canvas) {
    // круг, в который вписан текст
    canvas.drawCircle(mRadius, mRadius, mRadius, mGlowPaint);
    // высота строки
    float textHeight = mTextPaint.getFontSpacing();
    // измеряем длинну текста
    float widthText = mTextPaint.measureText(mText);
    if(widthText <= mRadius*2) {
        // всего одна строка помещается - рисуем ее и выходим
        canvas.drawText(mText, mRadius, mRadius, mTextPaint);
        return;
    }
    // 1 Делим строку на два, сдвигаем к ближайшему пробелу. получаем индекс пробела, близкого к середине текста
    int centerSpace = calcCenterSpace(mText);
    // 2 Сначала рисуем текст вверх  :
    String leftString = mText.substring(0, centerSpace);
    int cnt = 0; // количество прорисованных строк вверх
    float widthLine;
    int n;
    while (true) {
        // измеряем длинну строки
        widthLine = calcWidthLine(mRadius, textHeight * cnt++);
        // считаем сколько символов поместится в новой строке
        n = mTextPaint.breakText(leftString, false, widthLine, null);
        if (n == 0) // прерываем, так как строка слишком длинная
            break;
        // создаем строку
        int rest = leftString.length() - n;
        //  проверка на последнюю строку
        if (rest != 0) {
            String s = leftString.substring(leftString.length() - n);
            // обрезаем до первого пробела
            int fixed = s.indexOf(' ');
            // создаем новую аккуратную строку
            s = s.substring(fixed + 1);
            // рисуем ее на высоте соответствующую данной строке
            canvas.drawText(s, mRadius, mRadius - textHeight * cnt + textHeight, mTextPaint);
            // сокращаем левый кусок текста на длинну отрисованной строки
            leftString = leftString.substring(0, leftString.length() - s.length());
            } else { // последняя строка
                canvas.drawText(leftString, mRadius, mRadius - textHeight * cnt + textHeight, mTextPaint);
                break;
            }
        }
    // 3. Теперь рисуем вниз
    String rightString = mText.substring(centerSpace);
    cnt = 0; // количество прорисованных строк вверх
    while(true){
        widthLine = calcWidthLine(mRadius, textHeight * cnt++);
        n = mTextPaint.breakText(rightString, false, widthLine, null);
        if (n == 0) // прерываем если весь текст не поместился
            break;
        int rest = rightString.length() - n;
        if(rest != 0) {
            String s = rightString.substring(0, n);
            int fixed = s.lastIndexOf(' ');
            s = s.substring(0, fixed);
            canvas.drawText(s, mRadius, mRadius + textHeight * cnt, mTextPaint);
            rightString = rightString.substring(s.length(), rightString.length());
        }
        else {
            canvas.drawText(rightString, mRadius, mRadius + textHeight * cnt, mTextPaint);
            break;
        }
    }
}

private static int calcWidthLine(float r, float b){
    double a = Math.sqrt(r * r - b * b);
    return (int)(2*a);
}

private static int calcCenterSpace(String text){
    int index = text.length()/2;
    if(text.charAt(index) == ' ') return index;
    String subLeft = text.substring(0, index);
    int indexSpaceLeft = subLeft.lastIndexOf(' ');
    String subRight = text.substring(index + 2);
    int indexSpaceRight = subRight.indexOf(' ');
    if(index - indexSpaceLeft <= indexSpaceRight)
        return indexSpaceLeft;
    else
        return indexSpaceRight;
}

Алгоритм не идеален, на поставленную задачу выполняет. Еще в планах сделать растягивание строки. Оптимизация и недочеты приветствую. Вот скриншоты: введите сюда описание изображения

2

Можно сделать кастомное view с LinearLayout, содержащий TextView различной длины.

Предлагаю следующий алгоритм:

  1. Оценить размер круга, необходимый для размещения данного объема текста. Для выполнения этого шага нужно учесть остальные.
  2. Построить LinearLayout соответсвующей высоты и ширины.
  3. Разместить по строкам TextView различной длины. Длину определить по длине хорды на соответвующей высоте текста + высоты самой строки.
  4. Заполнить соответсвующие TextView текстом. Сложности могут возникнуть с переносом слов и обрывком строк не доходя до круга. Тут можно использовать свойство letter spacing: брать строки не больше заданной длины хорды и увеличивать letter-spacing, если строка меньше чем нужно.
  5. Поделиться реализацией с сообществом :-)
1

Создайте в Drawable bg_circle.xml:

<?xml version="1.0" encoding="utf-8"?>
   <item xmlns:android="http://schemas.android.com/apk/res/android">
   <shape>
     <corners
      android:topLeftRadius="30dp"
      android:topRightRadius="30dp"
      android:bottomLeftRadius="30dp"
      android:bottomRightRadius="30dp"
      />
  </shape>
</item>

Потом примените этот бекграунд к вашему TextView!

<TextView 
android:id="@+id/textView"
android:layout_height="60dp"
android:layout_width="60dp" 
android:text="X" 
android:textColor="#000"
android:textSize="20sp"
android:background="@drawable/bg_circle"
android:gravity="center_vertical|center_horizontal" 
/>
1
  • 2
    Данный вариант не подходит. Текст не будет ограничен кругом bg_circle.xml
    – miha_dev
    26 янв 2016 в 7:10

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.