Awesome LogIn/SignIn & SignUp UI/UX design tutorial with source code




In this post I will tell you how you can design awesome UI using simple XML code just follow this post and do the same which I told here...

 Hear is a demo of How its look and feel

1. Creating New Project

1. Create a new project in Android Studio from File ⇒ New Project and select Basic Activityfrom templates. 

2. Enable AppCompact-V7 and design in app/build.gradle. And Sync the project.

3. Download this Image file and past it in your project drawable folder.



4. Add the below resources to drawable folder background.xml, button_background.xml, layout_background.xml

background.xml

button_background.xml

 layout_background.xml




5. Go to app\src\main\res\values and open style.xml file and change Theme.AppCompat.Light.DarkActionbar to Theme.AppCompat.Light.NoActionBar

6. Now open your activity_main.xml file and past all of the code from bellow for the LogIn Activity.



7. Now open you MainActivity.java file and past all the java code from bellow for LogIn Activity to work.

8. Now create a new activity right click on your package name and click new and click activity and chose empty activity and name it as SignUpActivity.


9. Now open your activity_main.xml file and past all of the code from bellow for the SignUp Activity.



10. Now open you MainActivity.java file and past all the java code from bellow for SignUp Activity to work.

Thanks for visiting and thanks for your time if you have any suggestions and want to share any feed back then comment down bellow and if you face any issue then let me know in the comment section also share this with your friends

Comments

  1. Tuấn Thanh24 November 2018 at 07:15

    Thank you so much. I'm from Vietnam. I love youu!

    ReplyDelete
  2. Unknown5 May 2019 at 17:03

    hello guys, can u send me the code of this tuto ??? in my mail jasonphilippe90@gmail.com

    ReplyDelete
    Replies
    1. Monster Techno7 May 2019 at 10:48

      Sorry this project is deleted but you can get the code by yourself all the codes are here just copy and paste in your new project.

      Delete
  3. Unknown19 May 2019 at 08:57

    where is code?????

    ReplyDelete
  4. Unknown2 July 2019 at 21:43

    what is the use of databinding enabled when u use findviewbyid?

    ReplyDelete
  5. PSSU200016 August 2019 at 18:24

    thanks a lot, it's fantastic

    ReplyDelete
  6. Unknown5 September 2019 at 00:58

    this is a very good!!!!!
    elmsavar.ir

    ReplyDelete
  7. Unknown19 September 2019 at 19:04

    Is it possible change direction of layout_background.xml ?
    I mean that horizontal gap between two shapes starts from top-right to bottom-left.
    How can i do that ?

    ReplyDelete
  8. Unknown2 December 2019 at 12:53

    Hello... May I get the same code for kotlin..
    Because I'm using Kotlin for we development

    ReplyDelete
  9. Anonymous20 January 2020 at 20:56

    Nice tutorial. Can we get it in iOS also..?

    ReplyDelete
  10. Anonymous20 January 2020 at 20:56

    Nice tutorial. Can we get it in iOS also..?

    ReplyDelete

Post a Comment