Setting app level theme for TextInputLayout

If you have same design across app for TextInputLayout you can set app level style for TextInputLayout inside TextInputLayout you can set different properties to theme for TextInputLayout below is the example from material design theme.

you can change parent for TextInputLayout from FilledBox to OutlinedBox and other styles can use different properties to customize the design. there is list of properties you can explore on material design website.

If you have to different style for some places for TextInputLayout you can always set custom style at layout level xml which will override the app level theme.

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.MaterialComponents.Bridge">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="textInputStyle">@style/Widget.App.TextInputLayout</item>
    </style>

    <style name="Widget.App.TextInputLayout" parent="Widget.MaterialComponents.TextInputLayout.FilledBox">
        <item name="materialThemeOverlay">@style/ThemeOverlay.App.TextInputLayout</item>
        <item name="shapeAppearance">@style/ShapeAppearance.App.SmallComponent</item>
        <item name="hintTextColor">?attr/colorOnSurface</item>
        <item name="boxBackgroundColor">@android:color/background_dark</item>
    </style>

    <style name="ThemeOverlay.App.TextInputLayout" parent="">
        <item name="colorPrimary">@android:color/holo_red_light</item>
        <item name="colorOnSurface">@android:color/holo_red_light</item>
        <item name="colorError">@android:color/holo_blue_dark</item>
        <item name="textAppearanceSubtitle1">@style/TextAppearance.App.Subtitle1</item>
        <item name="textAppearanceCaption">@style/TextAppearance.App.Caption</item>
        <item name="editTextStyle">@style/Widget.MaterialComponents.TextInputLayout.FilledBox</item>
    </style>

    <style name="TextAppearance.App.Subtitle1" parent="TextAppearance.MaterialComponents.Subtitle1">

    </style>

    <style name="TextAppearance.App.Caption" parent="TextAppearance.MaterialComponents.Caption">

    </style>

    <style name="ShapeAppearance.App.SmallComponent" parent="ShapeAppearance.MaterialComponents.SmallComponent">
        <item name="cornerFamily">rounded</item>
        <item name="cornerSize">4dp</item>
    </style>
</resources>




Comments

Post a Comment

Popular posts from this blog

Using TabLayout and ViewPager with CollapsingToolbarLayout

Image
Using android TabLayout and new viewpager2 you can make your fragment layout inside tab layout to make them have expand collapse. To make the top layout collapse you have to use CollapsingToolbarLayout with combination of other layouts and properties. Below is the example where we use TabLayout , ViewPager2 with FragmentStateAdapter to host fragments. Main Activity Layout which host CollapsingToolbarLayout , TabLayout , ViewPager2 you can have this inside fragment also so viewpager can host other fragments. activity_tab_layout.xml <? xml version ="1.0" encoding ="utf-8" ?> <androidx.coordinatorlayout.widget.CoordinatorLayout xmlns: android ="http://schemas.android.com/apk/res/android" xmlns: app ="http://schemas.android.com/apk/res-auto" xmlns: tools ="http://schemas.android.com/tools" android :layout_width ="match_parent" android :layout_height ="match_parent" android :fitsSystemWind
Read more

Styling TextInput Layout with material design library

Image
Google release material design library which provides with material design styles for different components which can be customized. To get started you need to include material design library into your gradle file provided on this link : https://material.io/develop/android/docs/getting-started TextInputLayout provides different material styles Widget.MaterialComponents.TextInputLayout.FilledBox Widget.MaterialComponents.TextInputLayout.OutlinedBox for using above material themes you are required to use parent theme as parent="Theme.MaterialComponents.Bridge" this can become issue if you are using some old parent theme for your application changing the parent theme may change some UI are looking before changing to Theme.MaterialComponents.Bridge in place of changing the parent theme for your application you can assign new material components theme at your activity level your layout xml file root layout android:theme = "material theme" to keep your current dialogs and
Read more

Using android BadgeDrawable to show the Badge android

If you have to show badge previously on android most time you end up developing some view and put as overlay on FrameLayout or arranging on top of the layout you want to set it. Current limitation of BaadgeDrawable provided material library are :  No way to set custom font No way to set custom drawable No official way to set font size No way to set stroke border like you see on badges on many apps No way to set text can only set int If any of them are not problem for you , you can go ahead with badgeDrawable link to material design badgeDrawble : https://material.io/develop/android/supporting/badge Properties that are available to modify : Bade background color Badge text color number - count to set maxLength - max length like 3 is limit it will display 999+ for above length horizontal and vertical offset to change position x,y coordinate sample code looks like below, most places you have to use tree observer so you can attache once view is drawn, otherwise its not showing up fab. view
Read more