This is a Xamarin.Android port of Jared Verdi's JVFloatLabeledTextField, which was directly ported by Johan du Toit @johan_du_toit from the Android version by Henrik Sandström @heinrisch
Credits for the concept to Matt D. Smith (@mds).
http://dribbble.com/shots/1254439--GIF-Mobile-Form-Interaction?list=users
Get it on NuGet!
Grab the jvfloatsharp NuGet package using your package manager or by installing with the following command:
Install-Package jvfloatsharp
Usage
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" > <jvfloatsharp.FloatLabeledEditText android:layout_width="match_parent" android:layout_height="wrap_content"> <EditText android:layout_width="match_parent" android:layout_height="wrap_content" android:hint="This is the hint" /> </jvfloatsharp.FloatLabeledEditText> <!-- add some padding --> <jvfloatsharp.FloatLabeledEditText android:layout_width="match_parent" android:layout_height="wrap_content"> <EditText android:layout_width="match_parent" android:layout_height="wrap_content" android:hint="Username" /> </jvfloatsharp.FloatLabeledEditText> <!-- password input --> <jvfloatsharp.FloatLabeledEditText android:layout_width="match_parent" android:layout_height="wrap_content"> <EditText android:layout_width="match_parent" android:layout_height="wrap_content" android:hint="Password" android:inputType="textPassword" /> </jvfloatsharp.FloatLabeledEditText> </LinearLayout>
Also works with MvvmCross:
<?xml version="1.0" encoding="utf-8"?>
<jvfloatsharp.FloatLabeledEditText
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="This is the hint"
local:MvxBind="Text Hello" />
</jvfloatsharp.FloatLabeledEditText>
Styled By
- Marcus Gellemark Dribbble
