Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Option to code a rectangle with only two rounded corners #577

Open
garyfhudson opened this issue May 21, 2018 · 1 comment
Open

Option to code a rectangle with only two rounded corners #577

garyfhudson opened this issue May 21, 2018 · 1 comment

Comments

@garyfhudson
Copy link

I need to prototype a segmented control very like the DESIGN/CONTROL buttons on the Framer Interface. For that I need to put two buttons right next to each other with only the outermost corners of the pair rounded.

framer interface buttons

Thanks

@gejoreni
Copy link

gejoreni commented Jul 9, 2018

There are two ways to do this.

  1. simply change only the selected borders e.g.,
button1 = new Layer
	height: 50
	width: 100
	backgroundColor: "blue"
	borderRadius: 
		topLeft: 10
		bottomLeft: 10

button2 = new Layer
	height: 50
	width: 100
	backgroundColor: "red"
	x: button1.maxX
	borderRadius: 
		topRight: 10
		bottomRight: 10 

  1. put both layers in a parent layer round all border of the parent and clip.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants