css - hvordan gi kantlinje og kantlinjeradius til stacklayout i nativescript


Jeg er ny på NativeScript. Jeg vet ikke hvordan jeg skal gi ramme og rammeradius til StackLayout.

Nedenfor har jeg lagt ut hva jeg har prøvd så langt:

component.html:

 <StackLayout class ="stackBorder" orientation="horizontal">
    <Label text="Label 1" width="50" height="50" > </Label>
    <Label text="Label 2" width="50" height="50" > </Label>
    <Label text="Label 3" width="50" height="50" backgroundColor="white"> </Label>
    <Label text="Label 4" width="50" height="50" backgroundColor="white"> </Label>
  </StackLayout>

component.css:

StackLayout {
  margin: 10;
  background-color: green;

}

.stackBorder {
 border: 2px solid red;
   border-radius: 8px;
}

component.ts:

@Component({
    selector: "sdk-child-component",
    moduleId: module.id,
    templateUrl: "./component.html",
    styleUrls: ["./component.css"]
})

Endelig kan jeg ikke se kanten i stacklayout.

Svar #1

Via html:

<StackLayout borderRadius="30" borderColor="red" borderWidth="3"></StackLayout>

Via css:

StackLayout {
  border-color: red;
  border-width: 3;
  border-radius: 30;
}

Mer informasjon: https://docs.nativescript.org/ui-and-styling.html#supported-css-properties

Svar #2

I NativeScript er støttede CSS-egenskaper border-width, border-color og border-radius. Kun tag border er ikke mulig, og heller ingen solid valg.

Mer informasjon:

https://docs.nativescript.org/ui/styling

Relaterte artikler