聚合物1.2:更改纸张选定的背景颜色

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了聚合物1.2:更改纸张选定的背景颜色相关的知识,希望对你有一定的参考价值。

我搜索了我的问题,发现了this

但是,接受的解决方案对我不起作用但是我无法发表评论,因为我只有6个声望 - .-

所以情况是,我想使用纸张列表框中的Polymer框架中的paper-item,但是当你通过点击选择一个项目时,背景会变为灰色...文档和我链接的问题的答案abvoe建议覆盖--paper-item-selected / --paper-item-focus mixin,但这对我不起作用

我的代码:

<link rel="import" href="../../../external/Polymer/bower_components/polymer/polymer.html">


<dom-module id="cit-literal-item">

<template>
    <!-- scoped CSS for this element -->
    <style is="custom-style">
        .spacer {
            @apply(--layout-flex);
        }
        paper-item {
            --paper-item-selected: {
                background-color: #FFFFFF;
            };

            --paper-item-focused: {
                background-color: #FFFFFF;
            };
        }
    </style>
    <paper-item>Test</paper-item>
</template>
</dom-module>

主要文件代码:

...
<!-- Polymer custom elements -->
<link rel="import" href="lib/internal/dom-modules/literals/cit-literal-item.html">
...
<body>
    <paper-listbox>
        <cit-literal-item></cit-literal-item>
        <cit-literal-item></cit-literal-item>
    </paper-listbox>
</body>
答案

我找到了“解决方案”!我必须覆盖的属性称为--paper-item-focused-before

我查看了<paper-item>的源代码,并在shared-styles.html中找到了它

shared-styles.html
:host(.iron-selected) {
    font-weight: var(--paper-item-selected-weight, bold);
    @apply(--paper-item-selected);
  }
  :host([disabled]) {
    color: var(--paper-item-disabled-color, --disabled-text-color);
    @apply(--paper-item-disabled);
  }
  :host(:focus) {
    position: relative;
    outline: 0;
    @apply(--paper-item-focused);
  }
  :host(:focus):before {
    @apply(--layout-fit);
    background: currentColor;
    content: '';
    opacity: var(--dark-divider-opacity);
    pointer-events: none;
    @apply(--paper-item-focused-before);
  }

可以看出,默认情况下唯一应用颜色的mixin是--paper-item-focused-before,它将样式应用于:before<paper-item>伪元素。

另一答案

- 纸张项目重点 - 之前:{背景:透明; };

以上是关于聚合物1.2:更改纸张选定的背景颜色的主要内容,如果未能解决你的问题,请参考以下文章

设置选定的纸张标签

AlertDialog 更改片段中的背景颜色 [重复]

仅更改自定义 UITableViewCell 选定背景颜色的一部分

Flutter:更改 ListView.builder 中选定按钮的背景颜色

更改纸张颜色 Material-UI

如何更改 Pyside 中选定的行背景颜色?