clipShape

Clip a view with a rectangle, circle, or capsule.

clipShape(shape) clips everything produced by the preceding modifiers.

import { Image, Modifier, Shape } from "onescript/views"

const avatarURL = new URL("https://example.com/avatar.png")

<Image
  url={avatarURL}
  resizable
  modifier={Modifier
    .scaledToFill()
    .frame({ width: 64, height: 64 })
    .clipShape(Shape.circle)}
/>

Available shapes are Shape.rect(cornerRadius), Shape.circle, and Shape.capsule. See Shape.

How is this guide?

Last updated on

background

Draw a shape style behind a view.

frame

Give a view fixed or flexible layout dimensions.