【问题标题】:how to give border and border-radius to stacklayout in nativescript如何在nativescript中为stacklayout提供边框和边框半径
【发布时间】:2017-10-26 02:53:01
【问题描述】:

我是 nativescript 的新手。我不知道如何为 stacklayout 提供边框和边框半径。

下面我发布了到目前为止我尝试过的内容:

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"]
})

最后我在 stacklayout 中看不到边框。

【问题讨论】:

    标签: css typescript nativescript angular2-nativescript


    【解决方案1】:

    通过 html:

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

    通过 CSS:

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

    【讨论】:

      【解决方案2】:

      我猜你可以使用每边边框。 检查这个 https://www.nativescript.org/blog/per-side-borders-in-nativescript-css

      【讨论】:

        【解决方案3】:

        在 nativescript 中支持的 css 属性是边框宽度、边框颜色和边框半径。单独的标签边框是不可能的,也没有任何可靠的选择。

        更多信息:

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

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 1970-01-01
          • 2014-03-27
          • 1970-01-01
          • 1970-01-01
          • 2019-11-30
          • 1970-01-01
          • 1970-01-01
          • 2012-10-14
          相关资源
          最近更新 更多