kandi background
Explore Kits

material-components-android | Modular and customizable Material Design UI components for Android | User Interface library

 by   material-components Java Version: 1.6.0-rc01 License: Apache-2.0

 by   material-components Java Version: 1.6.0-rc01 License: Apache-2.0

Download this library from

kandi X-RAY | material-components-android Summary

material-components-android is a Java library typically used in User Interface applications. material-components-android has no bugs, it has no vulnerabilities, it has build file available, it has a Permissive License and it has high support. You can download it from GitHub.
Material Components for Android (MDC-Android) help developers execute Material Design. Developed by a core team of engineers and UX designers at Google, these components enable a reliable development workflow to build beautiful and functional Android apps. Material Components for Android is a drop-in replacement for Android's Design Support Library.
Support
Support
Quality
Quality
Security
Security
License
License
Reuse
Reuse

kandi-support Support

  • material-components-android has a highly active ecosystem.
  • It has 13557 star(s) with 2684 fork(s). There are 426 watchers for this library.
  • There were 4 major release(s) in the last 6 months.
  • There are 397 open issues and 1819 have been closed. On average issues are closed in 375 days. There are 40 open pull requests and 0 closed requests.
  • It has a positive sentiment in the developer community.
  • The latest version of material-components-android is 1.6.0-rc01
This Library - Support
Best in #User Interface
Average in #User Interface
This Library - Support
Best in #User Interface
Average in #User Interface

quality kandi Quality

  • material-components-android has 0 bugs and 0 code smells.
This Library - Quality
Best in #User Interface
Average in #User Interface
This Library - Quality
Best in #User Interface
Average in #User Interface

securitySecurity

  • material-components-android has no vulnerabilities reported, and its dependent libraries have no vulnerabilities reported.
  • material-components-android code analysis shows 0 unresolved vulnerabilities.
  • There are 0 security hotspots that need review.
This Library - Security
Best in #User Interface
Average in #User Interface
This Library - Security
Best in #User Interface
Average in #User Interface

license License

  • material-components-android is licensed under the Apache-2.0 License. This license is Permissive.
  • Permissive licenses have the least restrictions, and you can use them in most projects.
This Library - License
Best in #User Interface
Average in #User Interface
This Library - License
Best in #User Interface
Average in #User Interface

buildReuse

  • material-components-android releases are available to install and integrate.
  • Build file is available. You can build the component from source.
  • Installation instructions are available. Examples and code snippets are not available.
  • material-components-android saves you 101018 person hours of effort in developing the same functionality from scratch.
  • It has 128768 lines of code, 8336 functions and 2514 files.
  • It has medium code complexity. Code complexity directly impacts maintainability of the code.
This Library - Reuse
Best in #User Interface
Average in #User Interface
This Library - Reuse
Best in #User Interface
Average in #User Interface
Top functions reviewed by kandi - BETA

kandi has reviewed material-components-android and discovered the below as its top functions. This is intended to give you an instant insight into material-components-android implemented functionality, and help decide if they suit your requirements.

  • Initializes the textfield s error buttons .
  • Is called when a state changes .
  • Sets the EditText .
  • Calculates the base offsets .
  • Attaches the window insets to be applied to the given child view .
  • Draws the shadow .
  • Creates the reveal animation for a child .
  • Adds actions to the month navigation dialogs .
  • Set attributes from theme
  • Wrap a view in bottom sheet .

material-components-android Key Features

Modular and customizable Material Design UI components for Android

How does this android code get the activity from ? material-components-android-codelabs

copy iconCopydownload iconDownload
// getters
val newThing = stuff.getThing()
val newThing = stuff.thing

// setters
stuff.setThing(newThing)
stuff.thing = newThing

// boolean setters
dog.setGood(true)
dog.isGood = true

// boolean getters
val goodBoy = dog.isGood()
val goodBoy = dog.isGood

BottomNavigationView - why is there not enough space for the badge Drawable?

copy iconCopydownload iconDownload
val menuItemId: Int = bottomNavigation.getMenu().getItem(1).getItemId()
val badge: BadgeDrawable = bottomNavigation.getOrCreateBadge(menuItemId)
badge.setVisible(true)
badge.setNumber(4)
badge.setVerticalOffset(10) //value in pix
badge.setHorizontalOffset(-10) //value in pix

Return MaterialTimePicker

copy iconCopydownload iconDownload
MaterialTimePicker materialTimePicker = new MaterialTimePicker.Builder()
            .setTimeFormat(TimeFormat.CLOCK_24H)
            .build();


    pick.setOnClickListener(v -> materialTimePicker.show(getSupportFragmentManager(),
            DiConstant.TIME_PICKER));

    materialTimePicker.addOnPositiveButtonClickListener(dialog -> {
        int newHour = materialTimePicker.getHour();
        int newMinute = materialTimePicker.getMinute();
        String time = String.format(Locale.getDefault(), "%02d:%02d", newHour, newMinute);
        pick.setText(time);
    });
return materialTimePicker.show(getSupportFragmentManager(),
            "TIME_PICKER");
-----------------------
MaterialTimePicker materialTimePicker = new MaterialTimePicker.Builder()
            .setTimeFormat(TimeFormat.CLOCK_24H)
            .build();


    pick.setOnClickListener(v -> materialTimePicker.show(getSupportFragmentManager(),
            DiConstant.TIME_PICKER));

    materialTimePicker.addOnPositiveButtonClickListener(dialog -> {
        int newHour = materialTimePicker.getHour();
        int newMinute = materialTimePicker.getMinute();
        String time = String.format(Locale.getDefault(), "%02d:%02d", newHour, newMinute);
        pick.setText(time);
    });
return materialTimePicker.show(getSupportFragmentManager(),
            "TIME_PICKER");

LiveData update of BadgeDrawable in ToolBar MenuItem

copy iconCopydownload iconDownload
// This is an indicator of whether we need to show the badge or not
private var isFilterOn: Boolean = false

private var filterBadge: BadgeDrawable? = null

@SuppressLint("UnsafeExperimentalUsageError")
override fun onPrepareOptionsMenu(menu: Menu) {
    super.onPrepareOptionsMenu(menu)

    val filterItem = menu.findItem(R.id.action_filter)
    val toolbar = requireActivity().findViewById<Toolbar>(R.id.toolbar)

    if(filterBadge != null) {
        BadgeUtils.detachBadgeDrawable(filterBadge!!, toolbar, R.id.action_filter)
        filterBadge = null
    }

    if(isFilterOn) {
        filterBadge = BadgeDrawable.create(requireContext()).also {
            BadgeUtils.attachBadgeDrawable(it, toolbar, R.id.action_filter)
        }
    }

CountDown Timer with CircularProgressIndicator

copy iconCopydownload iconDownload
progressIndicator.progress = (millisUntilFinished / 1000).toInt()

Floating Action Button Android Studio does not show me background color and image in preview

copy iconCopydownload iconDownload
Android Studio > Menu bar > Help>check for updates.

How to change the Material Design TextInputLayout Hint Text Color?

copy iconCopydownload iconDownload
<style name="CustomOutlineBox" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
    <item name="boxStrokeColor">@color/text_input_layout_stroke_color</item>
    <item name="android:textColorHint">@color/text_color_hint</item>
    <item name="hintTextColor">@color/green</item>
</style>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:alpha="..." android:color="@color/red" android:state_enabled="false"/>
    <item android:alpha="..." android:color="@color/blue"/>
</selector>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:alpha="..." android:color="@color/green" android:state_focused="true"/>
    <item android:alpha="..." android:color="@color/green" android:state_hovered="true"/>
    <item android:alpha="..." android:color="@color/red" android:state_enabled="false"/>
    <item android:alpha="..." android:color="@color/blue"/>  <!-- unfocused -->
</selector>
-----------------------
<style name="CustomOutlineBox" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
    <item name="boxStrokeColor">@color/text_input_layout_stroke_color</item>
    <item name="android:textColorHint">@color/text_color_hint</item>
    <item name="hintTextColor">@color/green</item>
</style>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:alpha="..." android:color="@color/red" android:state_enabled="false"/>
    <item android:alpha="..." android:color="@color/blue"/>
</selector>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:alpha="..." android:color="@color/green" android:state_focused="true"/>
    <item android:alpha="..." android:color="@color/green" android:state_hovered="true"/>
    <item android:alpha="..." android:color="@color/red" android:state_enabled="false"/>
    <item android:alpha="..." android:color="@color/blue"/>  <!-- unfocused -->
</selector>
-----------------------
<style name="CustomOutlineBox" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
    <item name="boxStrokeColor">@color/text_input_layout_stroke_color</item>
    <item name="android:textColorHint">@color/text_color_hint</item>
    <item name="hintTextColor">@color/green</item>
</style>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:alpha="..." android:color="@color/red" android:state_enabled="false"/>
    <item android:alpha="..." android:color="@color/blue"/>
</selector>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:alpha="..." android:color="@color/green" android:state_focused="true"/>
    <item android:alpha="..." android:color="@color/green" android:state_hovered="true"/>
    <item android:alpha="..." android:color="@color/red" android:state_enabled="false"/>
    <item android:alpha="..." android:color="@color/blue"/>  <!-- unfocused -->
</selector>

Refresh Fragment view when RecyclerView.Adapter is changed

copy iconCopydownload iconDownload
class StaggeredProductCardRecyclerViewAdapter(private val theList: List) {

    private var listOfItems = theList

    fun removeItem(position: Int) {
        listOfItems = listOfItems.remove(position)
        notifyDatasetChanged()
    }
}

val featured = view.findViewById(R.id.featured) as Button
// set on-click listener
featured.setOnClickListener {
       adapter.removeItem(1)
}
class StaggeredProductCardRecyclerViewAdapter(private val initList: List<ProductEntry>?) : RecyclerView.Adapter<StaggeredProductCardViewHolder>() {

    private var productList: List<ProductEntry>? = initList

    override fun getItemViewType(position: Int): Int {
        return position % 3
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): StaggeredProductCardViewHolder {
        var layoutId = R.layout.shr_staggered_product_card_first
        if (viewType == 1) {
            layoutId = R.layout.shr_staggered_product_card_second
        } else if (viewType == 2) {
            layoutId = R.layout.shr_staggered_product_card_third
        }

        val layoutView = LayoutInflater.from(parent.context).inflate(layoutId, parent, false)
        return StaggeredProductCardViewHolder(layoutView)
    }

    override fun onBindViewHolder(holder: StaggeredProductCardViewHolder, position: Int) {
        if (productList != null && position < productList.size) {
            val product = productList[position]
            holder.productTitle.text = product.title
            holder.productPrice.text = product.price
            ImageRequester.setImageFromUrl(holder.productImage, product.url)
        }
    }

    override fun getItemCount(): Int {
        return productList?.size ?: 0
    }

    fun replaceList(items: List<ProductEntry>?) {
        productList = items
        notifyDatasetChanged()
    }
}
...
featured.setOnClickListener {
       adapter.replaceList(ProductEntry.initProductEntryList(resources, "featured"))
}
-----------------------
class StaggeredProductCardRecyclerViewAdapter(private val theList: List) {

    private var listOfItems = theList

    fun removeItem(position: Int) {
        listOfItems = listOfItems.remove(position)
        notifyDatasetChanged()
    }
}

val featured = view.findViewById(R.id.featured) as Button
// set on-click listener
featured.setOnClickListener {
       adapter.removeItem(1)
}
class StaggeredProductCardRecyclerViewAdapter(private val initList: List<ProductEntry>?) : RecyclerView.Adapter<StaggeredProductCardViewHolder>() {

    private var productList: List<ProductEntry>? = initList

    override fun getItemViewType(position: Int): Int {
        return position % 3
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): StaggeredProductCardViewHolder {
        var layoutId = R.layout.shr_staggered_product_card_first
        if (viewType == 1) {
            layoutId = R.layout.shr_staggered_product_card_second
        } else if (viewType == 2) {
            layoutId = R.layout.shr_staggered_product_card_third
        }

        val layoutView = LayoutInflater.from(parent.context).inflate(layoutId, parent, false)
        return StaggeredProductCardViewHolder(layoutView)
    }

    override fun onBindViewHolder(holder: StaggeredProductCardViewHolder, position: Int) {
        if (productList != null && position < productList.size) {
            val product = productList[position]
            holder.productTitle.text = product.title
            holder.productPrice.text = product.price
            ImageRequester.setImageFromUrl(holder.productImage, product.url)
        }
    }

    override fun getItemCount(): Int {
        return productList?.size ?: 0
    }

    fun replaceList(items: List<ProductEntry>?) {
        productList = items
        notifyDatasetChanged()
    }
}
...
featured.setOnClickListener {
       adapter.replaceList(ProductEntry.initProductEntryList(resources, "featured"))
}
-----------------------
class StaggeredProductCardRecyclerViewAdapter(private val theList: List) {

    private var listOfItems = theList

    fun removeItem(position: Int) {
        listOfItems = listOfItems.remove(position)
        notifyDatasetChanged()
    }
}

val featured = view.findViewById(R.id.featured) as Button
// set on-click listener
featured.setOnClickListener {
       adapter.removeItem(1)
}
class StaggeredProductCardRecyclerViewAdapter(private val initList: List<ProductEntry>?) : RecyclerView.Adapter<StaggeredProductCardViewHolder>() {

    private var productList: List<ProductEntry>? = initList

    override fun getItemViewType(position: Int): Int {
        return position % 3
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): StaggeredProductCardViewHolder {
        var layoutId = R.layout.shr_staggered_product_card_first
        if (viewType == 1) {
            layoutId = R.layout.shr_staggered_product_card_second
        } else if (viewType == 2) {
            layoutId = R.layout.shr_staggered_product_card_third
        }

        val layoutView = LayoutInflater.from(parent.context).inflate(layoutId, parent, false)
        return StaggeredProductCardViewHolder(layoutView)
    }

    override fun onBindViewHolder(holder: StaggeredProductCardViewHolder, position: Int) {
        if (productList != null && position < productList.size) {
            val product = productList[position]
            holder.productTitle.text = product.title
            holder.productPrice.text = product.price
            ImageRequester.setImageFromUrl(holder.productImage, product.url)
        }
    }

    override fun getItemCount(): Int {
        return productList?.size ?: 0
    }

    fun replaceList(items: List<ProductEntry>?) {
        productList = items
        notifyDatasetChanged()
    }
}
...
featured.setOnClickListener {
       adapter.replaceList(ProductEntry.initProductEntryList(resources, "featured"))
}
-----------------------
    supportFragmentManager.beginTransaction().detach(yourFragment).commitNow()
    supportFragmentManager.beginTransaction().attach(yourFragment).commitNow()

Extending MaterialButton: Should it be done? SavedState has package visibility

copy iconCopydownload iconDownload
public class MyButton extends MaterialButton
{
    private String text;

    //....


    static class SavedState extends AbsSavedState {
        @Nullable CharSequence myText;

        SavedState(Parcelable superState) {
            super(superState);
        }

        SavedState(@NonNull Parcel source, ClassLoader loader) {
            super(source, loader);
            myText = TextUtils.CHAR_SEQUENCE_CREATOR.createFromParcel(source);
        }

        @Override
        public void writeToParcel(@NonNull Parcel dest, int flags) {
            super.writeToParcel(dest, flags);
            TextUtils.writeToParcel(myText, dest, flags);
        }

        @NonNull
        @Override
        public String toString() {
            return "MyButton.SavedState{"
                    + " text="
                    + myText
                    + "}";
        }

        public static final Creator<SavedState> CREATOR =
                new ClassLoaderCreator<SavedState>() {
                    @NonNull
                    @Override
                    public SavedState createFromParcel(@NonNull Parcel in, ClassLoader loader) {
                        return new SavedState(in, loader);
                    }

                    @Nullable
                    @Override
                    public SavedState createFromParcel(@NonNull Parcel in) {
                        return new SavedState(in, null);
                    }

                    @NonNull
                    @Override
                    public SavedState[] newArray(int size) {
                        return new SavedState[size];
                    }
                };
    }

    @Nullable
    @Override
    public Parcelable onSaveInstanceState() {
        Parcelable superState = super.onSaveInstanceState();
        SavedState ss = new SavedState(superState);
        ss.myText = text;
        return ss;
    }

    @Override
    public void onRestoreInstanceState(@Nullable Parcelable state) {
        if (!(state instanceof SavedState)) {
            super.onRestoreInstanceState(state);
            return;
        }
        SavedState ss = (SavedState) state;
        super.onRestoreInstanceState(ss.getSuperState());
        text = ss.myText.toString();
    }
}

Material DateRangePicker enable Accept button with single date

copy iconCopydownload iconDownload
@SuppressLint("RestrictedApi")
class CustomMaterialDatePicker : RangeDateSelector() {

    private var first = true
    private var firstDate: Long? = null

    override fun select(selection: Long) {
        if (first || selection < firstDate!!) {
            super.select(selection)
            super.select(selection)
            firstDate = selection
            first = false
        } else {
            super.select(firstDate!!)
            super.select(selection)
            if (selection != firstDate) {
                first = true
            }
        }
    }
}
@SuppressLint("RestrictedApi")
private fun showDatePicker() {
    val selector = CustomMaterialDatePicker()
    val builder = MaterialDatePicker.Builder.customDatePicker(selector)
    builder.setTheme(R.style.CustomCalendarDatePickerTheme)
    builder.setCalendarConstraints(limitRange().build())

    val picker = builder.build()
    picker.addOnPositiveButtonClickListener {
        tv_date.text = formatRange(it.first!!, it.second!!)
        startDate = it.first
        endDate = it.second
    }

    picker.show(supportFragmentManager, picker.toString())
}
-----------------------
@SuppressLint("RestrictedApi")
class CustomMaterialDatePicker : RangeDateSelector() {

    private var first = true
    private var firstDate: Long? = null

    override fun select(selection: Long) {
        if (first || selection < firstDate!!) {
            super.select(selection)
            super.select(selection)
            firstDate = selection
            first = false
        } else {
            super.select(firstDate!!)
            super.select(selection)
            if (selection != firstDate) {
                first = true
            }
        }
    }
}
@SuppressLint("RestrictedApi")
private fun showDatePicker() {
    val selector = CustomMaterialDatePicker()
    val builder = MaterialDatePicker.Builder.customDatePicker(selector)
    builder.setTheme(R.style.CustomCalendarDatePickerTheme)
    builder.setCalendarConstraints(limitRange().build())

    val picker = builder.build()
    picker.addOnPositiveButtonClickListener {
        tv_date.text = formatRange(it.first!!, it.second!!)
        startDate = it.first
        endDate = it.second
    }

    picker.show(supportFragmentManager, picker.toString())
}

Community Discussions

Trending Discussions on material-components-android
  • Android material CardView ripple effect changes content color
  • How does this android code get the activity from ? material-components-android-codelabs
  • How to implement only a single component from a dependency in Android Studio?
  • How to add multiple project folders in Github repository
  • How to run the selected project from the Github repository in Android Studio
  • BottomNavigationView - why is there not enough space for the badge Drawable?
  • Return MaterialTimePicker
  • LiveData update of BadgeDrawable in ToolBar MenuItem
  • CountDown Timer with CircularProgressIndicator
  • Floating Action Button Android Studio does not show me background color and image in preview
Trending Discussions on material-components-android

QUESTION

Android material CardView ripple effect changes content color

Asked 2021-Dec-18 at 08:01

I recently moved from using custom card components to material design 3 cards. To my surprise, the ripple color, when pressing on the card, changes the content color. I tried this on the catalog project of the material-design-components repository and the card behaves the same way. My current code for changing the ripple color and the card background:

<style name="Widget.App.Card.Filled" parent="Widget.Material3.CardView.Filled">
   <item name="rippleColor">#4D4D4D</item>
   <item name="cardBackgroundColor">@android:color/transparent</item>
</style>

I also got a demo showing this behavior: https://i.imgur.com/t4WW4CY.mp4. The font color changes to a light gray based on the ripple effect. I am also using material buttons but there the ripple effect is not affecting the content. I am using the version 1.5.0-rc01.

Does anyone have an idea if that is intended and how I can only change the background color on press using the attributes given by the material design components.

Update:

My card view XML (its the one from the material-components github + custom style):

<com.google.android.material.card.MaterialCardView
      style="@style/Widget.App.Card.Filled"
      android:id="@+id/card"
      android:layout_width="match_parent"
      android:layout_height="0dp"
      android:layout_weight="0.4"
      android:layout_margin="16dp"
      android:clickable="true"
      android:focusable="true"
      app:contentPadding="@dimen/cat_card_content_padding">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="@string/cat_card_states_card_content"
        android:textAppearance="?attr/textAppearanceBody1"/>
  </com.google.android.material.card.MaterialCardView>

ANSWER

Answered 2021-Dec-18 at 08:01

I think this is happening because of the ripple color applying to the foreground instead of background. So yeah this is intended and i don't think you can change that.

Have a look at the source code : MaterialCardViewHelper.java

Note : This does not happen in buttons bcoz buttons applies ripple to the background instead of foreground.

Source code for button : MaterialButtonHelper.java

Source https://stackoverflow.com/questions/70379992

Community Discussions, Code Snippets contain sources that include Stack Exchange Network

Vulnerabilities

No vulnerabilities reported

Install material-components-android

For information on how to get started with Material Components for Android, take a look at our Getting Started guide.

Support

For usage questions: ask on Stack Overflow. Bugs or feature requests should be submitted at our GitHub Issues section.

DOWNLOAD this Library from

Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from
over 430 million Knowledge Items
Find more libraries
Reuse Solution Kits and Libraries Curated by Popular Use Cases

Save this library and start creating your kit

Explore Related Topics

Share this Page

share link
Compare User Interface Libraries with Highest Quality
Compare User Interface Libraries with Highest Security
Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from
over 430 million Knowledge Items
Find more libraries
Reuse Solution Kits and Libraries Curated by Popular Use Cases

Save this library and start creating your kit

  • © 2022 Open Weaver Inc.