mdc-components

actual use of foundation and adapter class of mdc-components

*爱你&永不变心* 提交于 2021-02-18 11:19:31
问题 I am trying mdc-components with angular4 project created using angular-cli . So I installed moduled using npm command npm install material-components-web this installed "material-components-web": "^0.22.0" Then created a component that contains HTML markup of slider <div #slider class="mdc-slider" tabindex="0" role="slider" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0" aria-label="Select Value"> <div class="mdc-slider__track-container"> <div class="mdc-slider__track"></div> </div>

Typing in TextField doesn't make label float

被刻印的时光 ゝ 提交于 2020-01-25 06:09:51
问题 I have made a form with Material Design components. My TextField floating labels float when AutoFill fills the inputs, but not when a user types in them. function fillFields() { $("#passwordTextField").val("test"); $("#usernameTextField").val("test"); } p.highlight-red-on-error { transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1); } div.mdc-text-field--invalid~p.highlight-red-on-error { color: #b00020; } <head> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha256

Typing in TextField doesn't make label float

徘徊边缘 提交于 2020-01-25 06:08:44
问题 I have made a form with Material Design components. My TextField floating labels float when AutoFill fills the inputs, but not when a user types in them. function fillFields() { $("#passwordTextField").val("test"); $("#usernameTextField").val("test"); } p.highlight-red-on-error { transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1); } div.mdc-text-field--invalid~p.highlight-red-on-error { color: #b00020; } <head> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha256

Typing in TextField doesn't make label float

人盡茶涼 提交于 2020-01-25 06:08:25
问题 I have made a form with Material Design components. My TextField floating labels float when AutoFill fills the inputs, but not when a user types in them. function fillFields() { $("#passwordTextField").val("test"); $("#usernameTextField").val("test"); } p.highlight-red-on-error { transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1); } div.mdc-text-field--invalid~p.highlight-red-on-error { color: #b00020; } <head> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha256

Material Design Components select menu not rendering correctly for web

南笙酒味 提交于 2019-12-11 06:35:18
问题 I'm trying to add a basic MDC select menu to my website. But it's not quite right—the right of the box shows the MDC arrow along with the normal HTML one, and the words are placed too close to the menu label (seen here). HTML part— <div class="mdc-select mdc-select--box day-select"> <select class="mdc-select__native-control" required> <option value="" disabled selected></option> <option value="grains"> Bread, Cereal, Rice, and Pasta </option> <option value="vegetables"> Vegetables </option>

MDCSnackbarFoundation Class usage

随声附和 提交于 2019-12-08 17:11:31
问题 How do I use MDCSnackbarFoundation ? with MDCSnackbar This documentation is not clear enough to get an idea. https://github.com/material-components/material-components-web/tree/master/packages/mdc-snackbar#using-the-foundation-class This is my code and I need to bind MDCSnackbarFoundation for it. logger = new MDCSnackbar($selector[0]); Thanks 回答1: At first you have to have a Node.js server. And then you have to install a package snackbar for Node.js like follows: npm install @material

AndroidX Build Fails in Release Mode regarding appComponentFactory

半世苍凉 提交于 2019-11-29 03:26:30
I'm using Android P and compiling against AndroidX. Works great in debug/beta, but when I make a release I get a cryptic crash during runtime: 2018-06-24 00:21:26.080 11971-11971/? E/LoadedApk: Unable to instantiate appComponentFactory java.lang.ClassNotFoundException: Didn't find class "androidx.core.app.CoreComponentFactory" on path: DexPathList[[zip file "/data/app/app.itsyour.elegantstocks-EuVZWdDgzplhm0Hpa90VwA==/base.apk"],nativeLibraryDirectories=[/data/app/app.itsyour.elegantstocks-EuVZWdDgzplhm0Hpa90VwA==/lib/x86, /system/lib]] at dalvik.system.BaseDexClassLoader.findClass

AndroidX Build Fails in Release Mode regarding appComponentFactory

一笑奈何 提交于 2019-11-27 03:11:31
问题 I'm using Android P and compiling against AndroidX. Works great in debug/beta, but when I make a release I get a cryptic crash during runtime: 2018-06-24 00:21:26.080 11971-11971/? E/LoadedApk: Unable to instantiate appComponentFactory java.lang.ClassNotFoundException: Didn't find class "androidx.core.app.CoreComponentFactory" on path: DexPathList[[zip file "/data/app/app.itsyour.elegantstocks-EuVZWdDgzplhm0Hpa90VwA==/base.apk"],nativeLibraryDirectories=[/data/app/app.itsyour.elegantstocks