2016-06-08 13 views
5

Używam TextInputLayout iw którym ustawi drawableLeft i kiedy klikam edittext etykieta jest już pływająca, ale chcę również przenieść lewy ciąg do rysowania z etykietą. Jak mogę to osiągnąć, zobacz załączony obraz ...Jak unieść lewą stronę do rysowania za pomocą etykiety (podpowiedź) w TextInputLayout?

Teraz, gdy klikam na "Tytuł", tylko leble jest unoszące się, ale chcę, aby obie były pływające "leftdrawable" i "label", gdy są skupione. A przed kliknięciem będzie wyglądać normalnie, jak "Data usługi".

enter image description here

Moje kodu jest poniżej ..

<FrameLayout 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:layout_below="@+id/input_layout_cardnum" 
    > 
    <ImageView 
     android:id="@+id/imgLeft" 
     android:layout_width="30dp" 
     android:layout_height="30dp" 
     android:layout_gravity="bottom" 
     android:src="@mipmap/ic_launcher" 
     android:layout_marginBottom="10dp" 
     /> 
    <android.support.design.widget.TextInputLayout 
     android:id="@+id/input_layout_cardnums" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     > 
     <EditText 
      android:id="@+id/cardnumEditTexst" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:maxLength="255" 
      android:singleLine="true" 
      android:hint="hello" 
      android:drawableLeft="@null" 
      android:paddingLeft="35dp" 
      /> 
    </android.support.design.widget.TextInputLayout> 
</FrameLayout> 

I w moim kodzie jestem ustawienie animacji na onfocus tak to idzie w górę z etykietą

final Animation animation = AnimationUtils.loadAnimation(this,R.anim.anims); 
    final ImageView imgLeft = (ImageView) findViewById(R.id.imgLeft); 

    final EditText et = (EditText) findViewById(R.id.cardnumEditTexst); 
    et.setOnFocusChangeListener(new View.OnFocusChangeListener() 
    { 
     @Override 
     public void onFocusChange(View v, boolean hasFocus) 
     { 
      if (hasFocus) 
      { 
       if (et.getText().length() == 0) 
       { 
        imgLeft.startAnimation(animation); 
       } 
      } else 
      { 
       if (et.getText().length() == 0) 
        imgLeft.clearAnimation(); 
      } 
     } 
    }); 

i My animacja rzuci widok obrazu na wierzch

<?xml version="1.0" encoding="utf-8"?> 
<set xmlns:android="http://schemas.android.com/apk/res/android" 
    android:fillAfter="true" 
    android:duration="200" 
    android:interpolator="@android:interpolator/linear" 
    > 
    <scale 
     android:fromXScale="0%" 
     android:fromYScale="0%" 
     android:toXScale="60%" 
     android:toYScale="60%" 
     android:pivotX="50%" 
     android:pivotY="50%" 
     /> 
    <translate 
     xmlns:android="http://schemas.android.com/apk/res/android" 
     android:startOffset="100" 
     android:fromYDelta="0%" 
     android:toYDelta="-80%"/> 

</set> 

I ustawiając to mam, teraz ruchome jest w porządku, ale zobacz paddingLeft = "35dp", chcę zacząć od pozycji 0. patrz na pierwszym obrazku, gdzie "Tytuł" pokazuje, mam na myśli, że nie powinien być dopełnieniem, ale jeśli będę usunąć paddingUkryj utratę funkcji pływającej.

enter image description here

+1

Musisz napisać twoja własna implementacja. TextInputLayout używa klasy [CollapsingTextHelper] (https://android.googlesource.com/platform/frameworks/support/+/6ba61c5/design/src/android/support/design/widget/CollapsingTextHelper.java), aby narysować animowany tekst na arkuszu brezentowy. Nie ma miejsca na personalizację, ponieważ ta klasa jest wewnętrzna. –

+0

@ S.D. Próbowałem dostosować, ale teraz mam tylko mały problem, chcę usunąć LeftPadding, tak aby użytkownik mógł wprowadzić bardzo początku, patrz obrazek –

+0

Po prostu usunąć/ustawić lewy ciąg do rysowania, gdy rozpoczyna się animacja. [TextInputLayout] (https://android.googlesource.com/platform/frameworks/support/+/6ba61c5/design/src/android/support/design/widget/TextInputLayout.java) ma TextListener monitorujący EditText w nim, oraz stąd uruchamia animację. –

Odpowiedz

3

spróbować ...

final Animation animation = AnimationUtils.loadAnimation(this, R.anim.anims); 
final ImageView imgLeft = (ImageView) findViewById(R.id.imgLeft); 

findViewById(R.id.cardnumEditTexst).setOnFocusChangeListener(new View.OnFocusChangeListener() { 
    @Override 
    public void onFocusChange(View v, boolean hasFocus) { 
     if (hasFocus) { 
      imgLeft.startAnimation(animation); 
     } else { 
      imgLeft.clearAnimation(); 
     } 
    } 
}); 

i

<set xmlns:android="http://schemas.android.com/apk/res/android" 
    android:duration="200" 
    android:fillAfter="true" 
    android:interpolator="@android:interpolator/linear"> 

    <scale 
     android:fromXScale="0%" 
     android:fromYScale="0%" 
     android:pivotX="50%" 
     android:pivotY="50%" 
     android:toXScale="60%" 
     android:toYScale="60%" /> 

    <translate xmlns:android="http://schemas.android.com/apk/res/android" 
     android:fromYDelta="0%" 
     android:startOffset="100" 
     android:toYDelta="-80%" /> 

</set> 

i ustawić układ jak ten ...

<FrameLayout 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:layout_below="@+id/input_layout_cardnum"> 

    <ImageView 
     android:id="@+id/imgLeft" 
     android:layout_width="30dp" 
     android:layout_height="30dp" 
     android:layout_gravity="bottom" 
     android:src="@mipmap/ic_launcher" 
     android:layout_marginBottom="10dp" /> 

    <android.support.design.widget.TextInputLayout 
     android:id="@+id/input_layout_cardnums" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content"> 

     <EditText 
      android:id="@+id/cardnumEditTexst" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:maxLength="255" 
      android:singleLine="true" 
      android:hint="hello" 
      android:drawableLeft="@null" 
      android:paddingLeft="35dp" /> 
    </android.support.design.widget.TextInputLayout> 
</FrameLayout> 
+0

Proszę zobaczyć moje zredagowane pytanie, nie dostaję się dobrze, zobacz obraz. –

Powiązane problemy