28

我正在尝试使用 LinearLayout 和 TableLayout 创建类似以下内容：

在此处输入图像描述

不过，我被困在垂直文本上。它占用的空间比旋转后应占用的空间多。

以下是 XML

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <TextView
        android:id="@+id/tv_CONSEQUENCES"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:rotation="-90"
        android:text="CONSEQUENCES"
        android:textAppearance="?android:attr/textAppearanceLarge" />

    <TableLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent" >

        <TableRow
            android:id="@+id/tableRow1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" >

            <Button
                android:id="@+id/button1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" />

            <Button
                android:id="@+id/button4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" />

            <Button
                android:id="@+id/button3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" />

            <Button
                android:id="@+id/button2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" />

        </TableRow>

        <TableRow
            android:id="@+id/tableRow1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" >

            <Button
                android:id="@+id/button1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" />

            <Button
                android:id="@+id/button4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" />

            <Button
                android:id="@+id/button3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" />

            <Button
                android:id="@+id/button2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" />

        </TableRow>
         <TableRow
            android:id="@+id/tableRow1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" >

            <Button
                android:id="@+id/button1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" />

            <Button
                android:id="@+id/button4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" />

            <Button
                android:id="@+id/button3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" />

            <Button
                android:id="@+id/button2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" />

        </TableRow>
         <TableRow
            android:id="@+id/tableRow1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" >

            <Button
                android:id="@+id/button1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" />

            <Button
                android:id="@+id/button4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" />

            <Button
                android:id="@+id/button3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" />

            <Button
                android:id="@+id/button2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" />

        </TableRow>
    </TableLayout>

</LinearLayout>

输出是这样的：

在此处输入图像描述

垂直文本占用的空间超出了应有的空间，并且并非所有文本都显示出来。:(

4

9 回答 9

20

您可以使用以下代码：

android:rotation="270"
于 2014-01-17T06:59:07.047 回答
12

没有一个解决方案对我有用，但我发现了 Mark Allison 的这篇博文： https ://blog.stylingandroid.com/verticaltext-part-1/

public class VerticalTextView extends TextView
{
    final boolean topDown;

    public VerticalTextView( Context context, 
        AttributeSet attrs )
    {
        super( context, attrs );
        final int gravity = getGravity();
        if ( Gravity.isVertical( gravity )
            && ( gravity & Gravity.VERTICAL_GRAVITY_MASK ) 
            == Gravity.BOTTOM )
        {
            setGravity( 
                ( gravity & Gravity.HORIZONTAL_GRAVITY_MASK )
                    | Gravity.TOP );
            topDown = false;
        }
        else
        {
            topDown = true;
        }
    }

    @Override
    protected void onMeasure( int widthMeasureSpec, 
        int heightMeasureSpec )
    {
        super.onMeasure( heightMeasureSpec, 
            widthMeasureSpec );
        setMeasuredDimension( getMeasuredHeight(), 
            getMeasuredWidth() );
    }

    @Override
    protected void onDraw( Canvas canvas )
    {
        TextPaint textPaint = getPaint();
        textPaint.setColor( getCurrentTextColor() );
        textPaint.drawableState = getDrawableState();

        canvas.save();

        if ( topDown )
        {
            canvas.translate( getWidth(), 0 );
            canvas.rotate( 90 );
        }
        else
        {
            canvas.translate( 0, getHeight() );
            canvas.rotate( -90 );
        }

        canvas.translate( getCompoundPaddingLeft(), 
            getExtendedPaddingTop() );

        getLayout().draw( canvas );
        canvas.restore();
    }
}

旋转是由重力完成的。所以一定要在你的xml中设置这个：

<com.stylingandroid.verticaltext.VerticalTextView
    style="@style/verticalTextStyle"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="bottom|right"
    android:text="@string/text" />
于 2016-11-09T17:02:32.497 回答
1

这是创建垂直文本视图的技巧。所以场景是我需要在屏幕右侧显示一个静态标签。所以我只是使用“\n”作为新行，因为我的文本较少。

机器人：文本="A\nC\nT\nI\nO\nN"

你可以查看我附上的图片。尽管如果您动态显示数据，则不建议这样做。 在此处输入图像描述

<TextView
    android:id="@+id/tv_action"
    android:layout_width="20dp"
    android:layout_height="126dp"
    android:background="@drawable/bg_red_left_rcorner"
    android:gravity="center"
    android:padding="2dp"
    android:textStyle="bold"
    android:text="A\nC\nT\nI\nO\nN"
    android:textColor="@color/white"
    app:layout_anchor="@+id/drawer_layout"
    app:layout_anchorGravity="end|center" />
于 2019-09-27T08:57:21.880 回答
1 
    val textPaint = Paint(Paint.ANTI_ALIAS_FLAG)
    textPaint.textSize=toPx(16)
    textPaint.color=Color.parseColor("#FFFFFF")
    canvas.save()
    canvas.translate(50F, 60F)
    canvas.rotate(90F)
    canvas.drawPaint(textPaint)
    canvas.drawText("YourText", 0F,0F, textPaint)
    canvas.restore()
于 2019-01-22T22:25:14.107 回答
0

将所有文本视图放在线性布局中，并尝试给予适当的布局权重来解决您的问题

于 2013-06-12T07:49:58.793 回答
0

在 .xml 文件中只放

<TextView> 
 android:layout_width="wrap content"
 android:layout_height="wrap content"
 android:rotation="270"
</TextView>
于 2018-06-28T07:26:51.307 回答
0 
        android:rotation="-90"
        android:layout_gravity="center"

为我工作。

于 2015-08-25T04:49:38.327 回答
-1

为什么不放填充？所以它会在你的屏幕中央。如果你喜欢就试试吧

于 2013-06-12T07:32:51.263 回答
-2

如果您想重现您的图像，我会使用没有按钮的 GridView 或 TableLayout，如果您需要执行任何操作，只需设置适当的侦听器即可。这样您就可以设置固定的高度和宽度。

于 2013-06-12T07:54:14.773 回答