Questions tagged [mdc-components]

Questions about Material Design Components (MDC) by Google, including MDC-Web, MDC-Android, MDC-IOS, and MDC-Flutter.

Material Components provide a reliable development environment for apps and websites across Android, iOS, and the web. Components are updated as the Material Design system evolves, ensuring consistent pixel-perfect implementation and adherence to Google’s front-end development standards, such as internationalization and accessibility support.

162 questions
5
votes
2 answers

MDC Automatic Instantiation

I am currently using the "Manual Instantiation" method and it works great. I noticed the "Automatic Instantiation" method but can't get it to work. What exactly is needed to use this method? When I use the…
Rhys
  • 489
  • 3
  • 14
4
votes
1 answer

Angular 15 theme overwritten by MDC components

Been following Angular material guidelines on theming, which led me to the following setup (ignore the $mx-* palettes, these are having correct values for 50..900 levels and likewise the contrasts): @use '@angular/material' as mat; @use…
4
votes
0 answers

How to get MDCMenu instance by element?

Let assume that I have a lot of html elements need to use MDCMenu. I don't want to init them one by one, so I init all of them with the code below: html:
cloudinstone
  • 99
  • 2
  • 4
4
votes
1 answer

Parcel + SASS: Import from node_modules without tilde operator? Or is it something else?

I am using Parcel with SASS, and I am trying to use the material-components-web (MDC Web). In the guide of MDC Web they say you should import the modules that come with this package like this inside your stylesheets: @import…
user3517228
  • 371
  • 1
  • 3
  • 4
4
votes
3 answers

How to set background color on autocomplete exposed dropdown menu?

Currently working on setting up an Exposed Dropdown menu item using the material design components and guidelines for menus. However when displaying my autocomplete text view it does not have the same background as my other text fields. I have…
4
votes
1 answer

Angular-mdc returning "No mixin named mdc-top-app-bar-fill-color"

So, I'm using angularCLI and angular-MDC, I want to use the second color of my styles.scss. There is on site https://trimox.github.io/angular-mdc-web/#/angular-mdc-web/top-app-bar-demo/sass this syntax mdc-top-app-bar-fill-color($color) I used and…
4
votes
2 answers

Shadow at the top of Bottom App Bar

I am using the new Bottom App Bar from the Material Design Components. I am trying to give shadow at the top of the Bottom App Bar like the one in Google Tasks app as shown below. I have tried using both android:elevation and app:elevation…
Mehul Kanzariya
  • 888
  • 3
  • 27
  • 58
4
votes
1 answer

Change placeholder alignment in MDCTextField with MDCTextInputControllerUnderline iOS Swift

Is it posible to change the placeholder text alignment in a MDCTextField that is using MDCTextInputControllerUnderline? What I am looking for is despite the placeholder appears like this: Place holder ............................. I want it at the…
Kevin Sanchez
  • 2,215
  • 2
  • 11
  • 19
4
votes
2 answers

How to include Material.io outlined textfield in non-Node.js app

I use Material Design with my non-Node.js app. I need to use the Material outlined textfield (with leading icon) in my HTML project. Material.io website shows JavaScript code for some components but does not show it for others. How can I add the…
4
votes
1 answer

Materials Components MDCTextField added to the Xcode Interface Builder does not accept user input

I have used Cocoapods to integrate MaterialsComponents with a new Xcode Project and entered Xcode via the Workspace. I then created a very basic interface with one UITextField added to the main.storyboard. I did a build without errors and the simple…
Newbie
  • 51
  • 1
  • 3
4
votes
2 answers

MDCTextField() Not Displaying Properly

I have a simple UIViewController where I am trying to learn how an MDCTextField can be configured. I have two errors the text field is not editable the helper text displays over the top of the text field instead of under it. How do I fix these two…
john
  • 505
  • 1
  • 7
  • 15
3
votes
1 answer

MDC web components - Deactivating focus from textfield not working

I am trying to implement an autocomplete input by using mdc web components. I have a menu selected event listener, where I want to deactivate focus on a textfield. I have tried that by using MDCTextFieldFoundation deactivateFocus method: const…
Leff
  • 1,968
  • 24
  • 97
  • 201
3
votes
1 answer

MDC menu - keep menu open when focus is on input

I am building an autocomplete input using mdc web components. I have an input textfield and a menu. You can see the codesandox here. I am showing the menu on focusin event, but if I start writing in the input field the menu is closed immediately.…
Leff
  • 1,968
  • 24
  • 97
  • 201
3
votes
1 answer

MDC Web: mdc-select update hidden input value on change (non-native select box) | JavaScript (JS)

Been doing well so far with MDC Web Components, but I've been hung up here for far too long. (Not strong in JS.) mdc-select used to be non-native, then used native HTML select, and now once again it's non-native. For a while MDC Web supported a…
JDizzle
  • 33
  • 4
3
votes
2 answers

Value Selected in Select Menu Not Being Sent To the Server

(Backend developer trying to do some front end development here) I have a simple HTML form with some text field inputs and a select menu. When the form is submitted I see the text field values hitting the web server but I don't see the value for the…
user3248346
1
2
3
10 11