Tutorial – Android Float Label binding for Xamarin.Android
We all enjoy animated, seamless and, in some way, intriguing experience in mobile apps.
One of the patterns we recommend to follow is a UX pattern called “Float Label pattern”.
As for Android, there is one for Java-based applications but there is nothing you can use in Xamarin.Android
So lets’s build one or (better) reuse existing!
Step 1 – get sources
Clone the repo by running
git clone --recursive firstname.lastname@example.org:IanGClifton/AndroidFloatLabel.git
Step 2 – compile java project
After clone, do following in the terminal:
cd AndroidFloatLabel ./gradlew
For me this command produced several errors, for example:
FAILURE: Build failed with an exception. * What went wrong: A problem occurred configuring project ':FloatLabel'. > Failed to notify project evaluation listener. > SDK location not found. Define location with sdk.dir in the local.properties file or with an ANDROID_HOME environment variable. > Cannot call getBootClasspath() before setTargetInfo() is called. * Try: Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. BUILD FAILED
Regarding this one, you need to open Xamarin Studio, then use menu “About Xamarin Studio” and in the dialog press button “Show details”.
Look for Xamarin.Android section and you will find:
Version: 126.96.36.199 (Business Edition)
Android SDK: /Users/theusername/Library/Developer/Xamarin/android-sdk-macosx
Next, go back to the terminal and execute
declare -x ANDROID_HOME="/Users/theusername/Library/Developer/Xamarin/android-sdk-macosx"
Running ./gradlew again showed me following:
* What went wrong: A problem occurred configuring project ':FloatLabel'. > Failed to notify project evaluation listener. > failed to find Build Tools revision 19.1.0 > Cannot call getBootClasspath() before setTargetInfo() is called. * Try: Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. BUILD FAILED
Now we have to install Android Build Tools 19.1. Do this from Xamarin Studio, menu Tools-> Open Android SDK Manager.
Make sure you check only that one package “Android SDK Build-tools” version 19.1, it’s right at the top of the list.
Next try brought another error:
* What went wrong: A problem occurred configuring project ':FloatLabelExample'. > Could not resolve all dependencies for configuration ':FloatLabelExample:_debugCompile'. > Could not find com.android.support:support-v4:21.0.3. Searched in the following locations: https://repo1.maven.org/maven2/com/android/support/support-v4/21.0.3/support-v4-21.0.3.pom https://repo1.maven.org/maven2/com/android/support/support-v4/21.0.3/support-v4-21.0.3.jar Required by: com.iangclifton.android:FloatLabelExample:1.0.3
For building bindings we don’t need “FloatLabelExample” project, so we can open file settings.gradle and delete following line
Save changes to the file, then run ./gradlew:
Welcome to Gradle 2.2.1. To run a build, run gradlew ... To see a list of available tasks, run gradlew tasks To see a list of command-line options, run gradlew --help BUILD SUCCESSFUL
In order to get android library compliled in Release mode, you have to run actually ./gradlew assembleRelease.
This command will produce something like
:FloatLabel:compileLint ........................ :FloatLabel:bundleRelease UP-TO-DATE :FloatLabel:assembleRelease UP-TO-DATE BUILD SUCCESSFUL File we need to proceed is the one in the folder FloatLabel/build/outputs/aar and it's named FloatLabel-release.aar
Step 3 – Building the bindings for Xamarin.Android
In our case we don’t need to follow the tutorial, creating binding for FloatLabel is very simple.
First, create an Android Java Binding Library project.
Then add FloatLabel-release.aar file from previous step to the folder Jars of that new project:
Done! Let’s do the final part and use that new control in our Xamarin.Android application.
Step 4 – using the control in Xamarin.Android app
Reference that new project in your Xamarin.Android application and use new control in layout:
Run the app and voila!
(btw, runs very smooth on an emulator and device, it’s just gif recording is little bit jerky).
Using Java components in Xamarin.Android is often very easy. Don’t be afraid and build good UX for your lovely users. Feedback and downloads will follow!
Have a good day!