Photoshop Question posted in
The official user guide can be found here.

Rectangle CornerRadius – Photoshop

This is somewhat a general question about rectangles with border radii. I’m working with a developer that’s taking my Photoshop comps and applying the designs to a prototype in Blend. They’ve told me that in Blend it’s not possible to create a rectangle with only 2 curved corners. Supposedly you have to have all 4 corners with a border radius or none at all. Ideally I’d like only the top left and right corners with a border radius of 10 and the bottom edges without a curve. I’d just like to know if this is possible to do.

Refer to example below

Tags:

2

Answers


  1. 0

    It is not be possible with Rectangle. But it is possible using Border.

    <Border Width="230" Height="100" CornerRadius="10 10 0 0" Background="red"/>

    The values will be applied in this fashion – “TopLeft TopRight BottomRight BottomLeft”

    Login or Signup to reply.
  2. 0

    Using Clip : RectangleGeometry

    <Rectangle Fill="Blue" HorizontalAlignment="Center"  VerticalAlignment="Center" Height="200" Width="200">
    <Rectangle.Clip>        
            <RectangleGeometry Rect="0,20,200,200"  RadiusX="20" RadiusY="20"/>                                                         
    </Rectangle.Clip>
</Rectangle>

    Using VisualBrush

     <Rectangle>
    <Rectangle.Fill>
        <VisualBrush Stretch="None">
            <VisualBrush.Visual>
                <Border CornerRadius="50,50,0,0"  Width="300" Height="200" Background="Navy"></Border>
            </VisualBrush.Visual>
        </VisualBrush>
    </Rectangle.Fill>
</Rectangle>

    enter image description here

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search