2016-08-12 2 views
-1

enter image description hereКак нарисовать полигон в андроиде с текстом внутри

Мне нужно сделать такой вид с текстом внутри. Текст и цвет рисунка должны быть изменены. Каков наилучший способ сделать это?

+0

Это просто 9 патч используется в качестве фона TextView в. Чтобы изменить цвет, см. Этот ответ: http://stackoverflow.com/a/21342724/2649012 –

ответ

0

Как только вы хотите нарисовать динамическую графику, вы попадаете в область рисования рук или используете какую-то стороннюю библиотеку, которая сделает это просто для вас.

К счастью, довольно просто сделать это самостоятельно. Вы можете нарисовать многоугольник с Canvas объекта, как в этом примере из this SO post:

Paint wallpaint = new Paint(); 
wallpaint.setColor(Color.GRAY); 
wallpaint.setStyle(Style.FILL); 

Path wallpath = new Path(); 
wallpath.reset(); // only needed when reusing this path for a new build 
wallpath.moveTo(x[0], y[0]); // used for first point 
wallpath.lineTo(x[1], y[1]); 
wallpath.lineTo(x[2], y[2]); 
wallpath.lineTo(x[3], y[3]); 
wallpath.lineTo(x[0], y[0]); // there is a setLastPoint action but i found it not to work as expected 

canvas.drawPath(wallpath, wallpaint); 

Там есть несколько способов, чтобы прикрепить Canvas в какой-то объект пользовательского интерфейса, который будет получить отображается на экране, основные из них, которые описаны на странице Canvas and Drawables документы, такие как

  1. Rendering к Bitmap, а затем добавление к, например, ImageView
  2. Расширение виджет пользовательского интерфейса, такие как View и обновляя его в onDraw методе

Чтобы изменить многоугольник, это так просто, как изменение х и у точек в ваших lineTo методов выше, а цвета в Paint. Убедитесь в том, чтобы обновить, если вам нужно, что может потребоваться вручную повторно рендеринга в Bitmap, если Вы выбираете способ 1, или позвонив invalidate на View, если Вы выбираете способ 2.

Для отображения текста внутри многоугольника , вы можете либо нарисовать на Canvas также методом drawText, либо поместить TextView поверх/сверху View в ваш формат XML. Если вы хотите, чтобы текст был строго внутри полигона, вам, очевидно, придется сделать некоторые вычисления для размещения и, возможно, разрывов строк и усечения.

См. Также справочную страницу Custom Drawing.

0

Вы можете достичь его с помощью треугольника изображения, как это:

<TextView 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:background="#FF2323" 
    android:drawableLeft="@drawable/triangle" 
    android:gravity="center" 
    android:paddingRight="10dp" 
    android:text="In Process" 
    android:textColor="@android:color/white" /> 

[enter image description here] Это изображение. Щелкните между квадратными скобками, чтобы сохранить его. Вы не сможете увидеть его на белом фоне, так как он белый.

Если вы хотите изменить размер этого изображения, установить изображение от деятельности, как это:

textView.setCompoundDrawablesWithIntrinsicBounds(new BitmapDrawable(getResources(), getResizedBitmap(this, R.drawable.triangle, 64, 64)), null, null, null); 

изменение 64 на то, что когда-нибудь подходит вам лучше всего.

и здесь является метод изменения размера:

public static Bitmap getResizedBitmap(Context activity,int imgid,int width,int height) { 
    Bitmap bMap = BitmapFactory.decodeResource(activity.getResources(),imgid); 
    Bitmap bMapScaled = Bitmap.createScaledBitmap(bMap, width,height, true); 
    return bMapScaled; 
} 
0

Создание селектора и установить в фоновом режиме Drawable из TextView

<!-- Colored rectangle--> 
<item> 
    <shape android:shape="rectangle"> 

     <size 
      android:width="100dp" 

      android:height="40dp" /> 
     <solid android:color="#FF0000" /> 
    </shape> 

</item> 

<!-- This rectangle for the left side --> 
<!-- Its color should be the same as layout's background --> 
<item 
    android:right="100dp" 
    android:left="-100dp" 
    android:top="-100dp" 
    android:bottom="-100dp"> 
    <rotate 
     android:fromDegrees="-45"> 
     <shape android:shape="rectangle"> 

      <solid android:color="#ffffff" /> 
     </shape> 
    </rotate> 
</item> 

<!-- This rectangle for the right side --> 
<!-- Their color should be the same as layout's background --> 
<item 
    android:right="100dp" 
    android:left="100dp" 
    android:top="-100dp" 
    android:bottom="-100dp"> 
    <rotate 
     android:fromDegrees="45"> 

     <shape android:shape="rectangle"> 

      <solid android:color="#ffffff" /> 
     </shape> 
    </rotate> 
</item>