برای جستجو کلمه مورد نظر خود را وارد کنید

به نام خدا Floating Labels

سلام ، در خدمتتون هستیم با آموزش Floating Labels

زمانی که کاربر قصد نوشتن متنی در ادیت تکست ها رو داره متن hint درون ادیت تکست به سمت بالا حرکت میکنه .

__

برای اضافه کردن در اولین مرحله باید کتابخانه ی AppCompat و Design رو در build.gradle وارد کنیم :

dependencies {  
    compile 'com.android.support:appcompat-v7:23.2.1' 
    compile 'com.android.support:design:23.2.1' 
}

پس از اون باید مطمئن بشیم که اکتیویتی مورد نظر ما extend شده باشه از AppCompatActivity  :

public class MainActivity extends AppCompatActivity { 
...
}

در مرحله ی بعد EditText رو درون TextInputLayout قرار میدیدم :

<android.support.design.widget.TextInputLayout  
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="@string/Title" />

</android.support.design.widget.TextInputLayout>

هر دو EditText و TextInputLayout دارای android:hint هستند و شما میتونید هر تمی رو برای اون استفاده کنید.

_

برای اینکه Style مورد نظر خودمون رو (رنگ هنگام تپ شدن) به EditText بدیم باید به این شیوه عمل کنیم :

باید Custom Style خودمون رو در style.xml وارد کنیم :

<!--Floating label text style-->  
<style name="MyHintText" parent="TextAppearance.AppCompat.Small">  
    <item name="android:textColor">@color/pink</item>
</style>

<!--Input field style-->  
<style name="MyEditText" parent="Theme.AppCompat.Light">  
    <item name="colorControlNormal">@color/indigo</item>
    <item name="colorControlActivated">@color/pink</item>
</style>

و برای وارد کردن رنگ مورد نظر ، کافیه که کد رنگ رو بجای این قسمت وارد کنیم :

@color/indigo | @color/pink

این استایل رو برای TextInputLayout با app:hintTextAppearance و برای EditText با android:theme وارد میکنیم .

و تنها کار باقی مونده وارد کردن این Style برای EditText و TextInputLayout مورد نظر ماست :

<android.support.design.widget.TextInputLayout  
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:hintTextAppearance="@style/MyHintText">

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="@string/Title"
        android:theme="@style/MyEditText" />

</android.support.design.widget.TextInputLayout>

نتیجه ی نهایی :

Floating Labels

Floating Labels

__

امیداوریم که آموزش برای شما مفید بوده باشه ، موفق باشید .