如何设置 RadDataForm 日期选择器的 day/month/year 选择器的样式

Question

我在 Nativescript 中有一个 RadDataForm-Angular 应用程序。

此 RadDataForm 显示了我的一个属性的日期选择器。

我已阅读有关 styling the components of a RadDataForm 的内容，但它缺少有关如何设置更改日期时显示的 "wheel texts" 样式的部分。（或者我错过了什么？）

它们保持黑色，但我需要另一种颜色（即白色）

Answer 1

The appearance of UIDatePicker is not customizable.

You should integrate date pickers in your layout using Auto Layout. Although date pickers can be resized, they should be used at their intrinsic content size.

但是，您可以设置的东西很少。我为 here.

创建了一个游乐场

在你的 html

<RadDataForm [source]="album" (editorUpdate)="dfEditorUpdate($event)">
            <TKEntityProperty tkDataFormProperty name="albumName" displayName="Name of Album"
                index="0"></TKEntityProperty>
            <TKEntityProperty tkDataFormProperty name="bandName" displayName="Name of Band"
                index="1"></TKEntityProperty>
            <TKEntityProperty tkDataFormProperty name="year" displayName="Release Year"
                index="2"></TKEntityProperty>
            <TKEntityProperty tkDataFormProperty name="myRating" displayName="My Rating"
                index="3"></TKEntityProperty>
            <TKEntityProperty tkDataFormProperty name="owned" displayName="Do I Own This?"
                index="4"></TKEntityProperty>
            <TKEntityProperty tkDataFormProperty name="birthDate" index="5">
                <TKPropertyEditor tkEntityPropertyEditor type="DatePicker">
                    <TKPropertyEditorStyle tkPropertyEditorStyle strokeColor="#00695c"
                        strokeWidth="2" fillColor="#4db6ac" labelHidden="false"
                        labelTextSize="18" ios:labelFontName="Times New Roman"
                        android:labelFontName="sans-serif-light"
                        labelFontStyle="Italic" labelPosition="Left"
                        labelWidth="60" labelTextColor="#ffffff"></TKPropertyEditorStyle>
                </TKPropertyEditor>
            </TKEntityProperty>
        </RadDataForm>

并在您的 .ts 文件中

import { Color } from "tns-core-modules/color";
import { EntityProperty, DataFormEventData, RadDataForm } from "nativescript-ui-dataform";

let colorLight = new Color("#ff0000");
let colorWhite = new Color("#ffffff");
let colorDark = new Color("#4CAF50");
let colorGray = new Color("#F9F9F9");

和

public dfEditorUpdate(args: DataFormEventData) {
        if (androidApplication) {
            switch (args.propertyName) {
                case "appVolume":
                    break;
            }
        } else {
            const entityProperty: EntityProperty =
                (<RadDataForm>args.object).getPropertyByName(args.propertyName);

            switch (entityProperty.editor.type) {
                case "DatePicker":

                    const coreEditor = args.editor.editor;
                    coreEditor.subviews[0].backgroundColor = colorLight.ios;
                    coreEditor.subviews[0].setValueForKeyPath(colorWhite.ios, 'textColor');


                    break;

            }
        }
    }

如何设置 RadDataForm 日期选择器的 day/month/year 选择器的样式

How to style the day/month/year selectors of a RadDataForm Datepicker

nativescript

nativescript-angular