[Flutter] BoxDecoration border Outline 만들기

 

기본 형태!

 

BoxDecoration 

decoration: BoxDecoration(
    borderRadius: BorderRadius.circular(8),
    border: Border.all(
        width: 2,
        color: Colors,black,
    ),
)

 

 

- 아래만 (일부만) 테두리

 

 

border: Border(
  bottom: BorderSide(
    color: Colors.black,
    width: 2,
  ),
),

- 오른쪽, 위쪽만 border 만들기

border: Border(
    right: BorderSide(
        color: Colors.black,
        width: 2,
    ),
    top: BorderSide(
        color: Colors.black,
        width: 2,
    ),
),

 

 

- 박스를 둥글게 만들기

borderRadius: BorderRadius.circular(8),

 

- 박스 일부만 둥글게

borderRadius: BorderRadius.only(
  topLeft: Radius.circular(20),
  bottomRight: Radius.circular(20),
),

 

반응형

하지만 

 

decoration: BoxDecoration(
    borderRadius: BorderRadius.only(
      topRight: Radius.circular(20),
    ),
    border: Border(
      right: BorderSide(
        color: Colors.black,
        width: 2,
      ),
      top: BorderSide(
        color: Colors.black,
        width: 2,
      ),
    ),
  ),

이렇게 사용하면

════════ Exception caught by rendering library ═════════════════════════════════
A borderRadius can only be given for a uniform Border.
The relevant error-causing widget was
Container lib/…/~~
═══════════════════════════════════════════════════════════════════════

 

 

테두리를 일부만 주고 radius를 주면 익셉션 나니 주의 할 것 

한참을 헤맸다... 

 

일부 테두리에 일부 만 radius를 주고 싶으면 어떻게 해야 하는 거지?ㅠㅠㅠ