2017-04-15 61 views
-1

我想在我的應用程序創建這樣的事情(從谷歌文檔拍攝):TextInputLayout文本區域 - 安卓

enter image description here

enter image description here

現在,我試圖創建一個TextInputLayout元素,並試圖把邊框放在它周圍,但我無法設法讓這看起來像我張貼的圖像。

這裏是我的TextInputLayout代碼:

<android.support.design.widget.TextInputLayout 
     android:id="@+id/shipper_layout" 
     android:layout_width="match_parent" 
     android:layout_height="150dp" 
     android:layout_marginLeft="8dp" 
     android:layout_marginRight="8dp" 
     android:layout_marginTop="8dp" 
     android:background="@drawable/text_layout_stroke_normal" 
     app:layout_constraintLeft_toLeftOf="parent" 
     app:layout_constraintRight_toRightOf="parent" 
     app:layout_constraintTop_toTopOf="parent" 
     android:layout_marginStart="8dp" 
     android:layout_marginEnd="8dp"> 

     <EditText 
      android:id="@+id/shipper_field" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:padding="15dp" 
      android:background="@null" 
      android:gravity="top" 
      android:hint="@string/shipper_field" 
      android:inputType="textMultiLine" 
      android:overScrollMode="always" 
      android:scrollbarStyle="insideInset" 
      android:scrollbars="vertical" /> 
    </android.support.design.widget.TextInputLayout> 

下面是它的外觀: (聚焦)之前

enter image description here

enter image description here

你可以看到邊框ISN不會如預期的那樣變化,提示只是最小化

+0

你想要什麼。什麼是你的要求 –

+0

@AshishShahi我如何創建一個像谷歌材料文檔一樣的textarea? –

+0

將線條屬性設置爲您的編輯文本。對於例如android:lines =「5」 –

回答

2

試試這個

創建繪製文件夾中的XML文件名爲custom_borders.xml並粘貼下面的代碼

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> 

    <stroke android:color="#ff0000" android:width="2dp"></stroke> 
    <corners android:radius="5dp"></corners> 

</shape> 

並將其應用到你的TextInputLayout這樣

android:background="@drawable/custom_borders" 
1

我想你問題是如何根據狀態改變背景。您可以簡單地在您的可繪製文件夾中編輯當前的text_layout_stroke_normal.xml。將這個代碼放入該文件,它會根據對焦狀態改變:

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:state_focused="false"> 
     <shape> 
      <stroke android:width="1dp" android:color="@android:color/secondary_text_light" /> 
      <corners android:radius="5dp" /> 
     </shape> 
    </item> 

    <item android:state_focused="true"> 
     <shape> 
      <stroke android:width="2dp" android:color="@color/colorAccent" /> 
      <corners android:radius="5dp" /> 
     </shape> 
    </item> 
</selector> 
2

試試這個代碼:

以XML

<android.support.design.widget.TextInputLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:id="@+id/shipper_layout" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_marginEnd="8dp" 
    android:layout_marginLeft="8dp" 
    android:layout_marginRight="8dp" 
    android:layout_marginStart="8dp" 
    android:layout_marginTop="8dp" 
    app:layout_constraintLeft_toLeftOf="parent" 
    app:layout_constraintRight_toRightOf="parent" 
    app:layout_constraintTop_toTopOf="parent"> 

    <EditText 
     android:id="@+id/shipper_field" 
     android:layout_width="match_parent" 
     android:layout_height="150dp" 
     android:background="@drawable/text_layout_stroke_normal" 
     android:gravity="top" 
     android:hint="HELLO" 
     android:inputType="textMultiLine" 
     android:overScrollMode="always" 
     android:padding="15dp" 
     android:scrollbarStyle="insideInset" 
     android:scrollbars="vertical" /> 
</android.support.design.widget.TextInputLayout> 

現在代碼programetically改變邊框和提示顏色Edittext使用setOnFocusChangeListener

edittext.setOnFocusChangeListener(new OnFocusChangeListener() {   
     public void onFocusChange(View v, boolean hasFocus) { 
      if(hasFocus) { 
       GradientDrawable drawable = (GradientDrawable)edittext.getBackground(); 
       drawable.setStroke(2, Color.RED); 
       edittext.setHintTextColor(Color.RED); 
      } 
     } 
    });