Question

I’m creating a bar graph like structure using buttons and textviews.

I want to display some specific value above each bar.

If the value is within 4 digits, it gets displayed properly but as soon as 5 digit no. comes, text gets wrapped as shown in below screenshot.

I eaven tried android:singleLine="true", but that doesn’t change anything.

layout:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <SeekBar
        android:id="@+id/seekBar"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="50dp"
        android:maxHeight="9dp"
        android:minHeight="9dp"
        android:padding="10dp"
        android:max="100"
        android:progressDrawable="@drawable/seekbar_progress"
        android:thumb="@drawable/shine_btn" />

    <TextView
        android:id="@+id/tvValue"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"        
        android:layout_alignRight="@id/seekBar"
        android:layout_marginBottom="10dp"
        android:layout_marginRight="10dp"
        android:layout_marginTop="30dp" />

    <LinearLayout
        android:id="@+id/Graph01"
        android:layout_width="wrap_content"
        android:layout_height="200dp"
        android:layout_below="@id/seekBar"
        android:layout_marginTop="50dp"
        android:gravity="bottom"
        android:orientation="vertical"
        android:weightSum="1" >

        <com.example.calci.views.MyTextView
            android:id="@+id/tvGraph01"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingBottom="5dp" />        
        <Button
            android:id="@+id/btnGraph01"
            android:layout_width="wrap_content"
            android:layout_height="0dp"
            android:layout_weight="0.1"                        
            android:background="#99f" />                
    </LinearLayout>


    <LinearLayout
        android:id="@+id/Graph02"
        android:layout_width="wrap_content"
        android:layout_height="200dp"
        android:layout_below="@id/seekBar"
        android:layout_marginTop="50dp"
        android:layout_toRightOf="@id/Graph01"
        android:gravity="bottom"
        android:orientation="vertical"
        android:weightSum="1" >

        <com.example.calci.views.MyTextView
            android:id="@+id/tvGraph02"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingBottom="5dp" />

        <Button
            android:id="@+id/btnGraph02"
            android:layout_width="wrap_content"
            android:layout_height="0dp"
            android:layout_weight="0.1"
            android:background="#9f9" />
    </LinearLayout>

<!-- AND SO ON... -->
<RelativeLayout />

---

activity:

seekBar.setOnSeekBarChangeListener(new OnSeekBarChangeListener() {

        @Override
        public void onProgressChanged(SeekBar seekBar, int progress,
                boolean fromTouch) {
lp = new LinearLayout.LayoutParams(new ViewGroup.MarginLayoutParams(20,
            LinearLayout.LayoutParams.WRAP_CONTENT));
    lp.setMargins(55, 0, 0, 0);
    tvGraph01.setLayoutParams(lp);
    tvGraph01.setTextSize(6);
    tvGraph01.setGravity(Gravity.CENTER);

    lp = new LinearLayout.LayoutParams(new ViewGroup.MarginLayoutParams(20,
            LinearLayout.LayoutParams.WRAP_CONTENT));
    lp.setMargins(2, 0, 0, 0);
    tvGraph02.setLayoutParams(lp);
    tvGraph02.setTextSize(6);
    tvGraph02.setGravity(Gravity.CENTER);

lp = new LinearLayout.LayoutParams(20, 0, 0.0002f * 2 * progress * 20);
    lp.setMargins(55, 0, 0, 0);
    btnGraph01.setLayoutParams(lp);

    lp = new LinearLayout.LayoutParams(20, 0, 0.0002f * 2 * progress * 15);
    lp.setMargins(2, 0, 0, 0);
    btnGraph02.setLayoutParams(lp);
               }
    });

---

MyTextView

public class MyTextView extends TextView {
@Override
    protected void onDraw(Canvas canvas) {
        canvas.save();
// RORARING the textbox as I want to show text at right angle.
        canvas.rotate(270, getWidth() / 2, getHeight() / 2);
        super.onDraw(canvas);
        canvas.restore();
    }
}

---

I guess prime reason behind this is setting height of the textview as 20.
I tried increasing the height of textview, but that increases the space between buttons.
I tried various values of gravity, but that also don’t work.

ANY HELP APPRECIATED…

EDIT

1). Anything from .android:singleLine="true" or android:ellipsize="end" or android:maxLines="1"wont work for my cause as I don’t want to put … for text wrapping.
I want to display the full text.

2). Setting android:layout_height="300dp" to LinearLayout didn’t made any difference apart from increase in height of all buttons.

3). Setting android:layout_height="150dp" to TextView didn’t made any difference as I’m setting height and width in code.

Answer 1

One important change which was required : changing android:layout_toRightOf="@id/Graph01 in LinearLayout with id Graph02 to android:layout_toRightOf="@id/tvGraph01"

i.e. even if textview width increases, corresponding linearlayout won’t be affected.

Also, I have to set margins for tvGraph02,btnGraph02,etc. after increasing width of textview in code.