如何將旋轉的 TextView 對齊到 RelativeLayout 的左側

Question

我將 TextView 旋轉了 270 度。 但問題是它從 x 軸的中點旋轉，因此左右有一個空間。 並且由於空間的原因，文本無法在 Relative 布局的左側對齊。

這是我的代碼

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:orientation="vertical"
     android:layout_width="match_parent"
     android:layout_height="300dp">
     <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:rotation="270"
        android:text="Sept 2015 - Dec 2016"
      />
</RelativeLayout>

這是結果。

我想像這樣對齊 TextView

Answer 1

視圖 class 具有 setPivotX() 和 setPivotY() 方法，用於設置完成旋轉的點。 使用這些方法設置方便的旋轉點。 對應的屬性是 android:transformPivotX 和 android:transformPivotY

Answer 2

我將 TextView 旋轉了 270 度。 但問題是它從 x 軸的中點旋轉，因此左右有一個空間。 並且由於空間的原因，文本不能在相對布局的左側對齊。

這是我的代碼

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:orientation="vertical"
     android:layout_width="match_parent"
     android:layout_height="300dp">
     <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:rotation="270"
        android:text="Sept 2015 - Dec 2016"
      />
</RelativeLayout>

這是結果。

我想像這樣對齊 TextView

Answer 3

正如@Rediska 建議的那樣。 我添加了android:transformPivotX="0dp"它旋轉了文本，但文本脫離了布局。 所以我不得不添加一個頂部邊距以使其可見。 現在我添加了 100dp 的邊距。 但要使其適用於 TextView 的所有長度。我應該首先計算 textView 的寬度，然后將其用作上邊距。

更新后的代碼

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:id="@+id/timeline"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:rotation="270"
        android:text="Sept 2015 - Dec 2016"
        android:textSize="10dp"
        android:transformPivotX="0dp"
        android:textStyle="bold"
        android:layout_marginTop="100dp"
        />
</RelativeLayout>

結果

Answer 4

我有一個類似的問題，但在 ConstraintLayout 中。 這是我的解決方案，當然是在 RelativeLayout 中。

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

    <androidx.appcompat.widget.AppCompatTextView
        android:id="@+id/leftSideTextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:text="Left side"
        android:textSize="24sp" />


    <androidx.appcompat.widget.AppCompatTextView
        android:id="@+id/rightSideTextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:text="Right side"
        android:textSize="24sp" />

</RelativeLayout>

和代碼：

private fun leftSide() {
    val leftSideText = findViewById<TextView>(R.id.leftSideTextView)
    leftSideText.doOnLayout { left ->
        left.rotation = -90f
        val textSize = (left as TextView).textSize
        left.translationX = -left.width / 2.toFloat() + textSize / 2
    }
}

private fun rightSide() {
    val rightSideText = findViewById<TextView>(R.id.rightSideTextView)
    rightSideText.doOnLayout { right ->
        right.rotation = 90f
        val textSize = (right as TextView).textSize
        right.translationX = right.width / 2.toFloat() - textSize / 2
    }
}