Swift metal, corner irregular shape

Question

I am developing an application in which non-standard shapes need to be rounded

what I mean

non-standard rect

for rounding i do this ( Metal shader )

constant float2 c00s = float2(0.0, 0.0); 
constant float2 c01s = float2(0.0, 1.0);
constant float2 c11s = float2(1.0, 1.0);
constant float2 c10s = float2(1.0, 0.0);

// Check if a point is within a given corner
bool in_cornerS(float2 p, float2 corner, float2 radius) {
  // determine the direction we want to be filled
  float2 axis = (c11s - corner) - corner;

  // warp the point so we are always testing the bottom left point with the
  // circle centered on the origin
  p = p - (corner + axis * radius);
  p *= axis / radius;
  return (p.x > 0.0 && p.y > -1.0) || (p.y > 0.0 && p.x > -1.0) || dot(p, p) < 1.0;
}

bool test_rounded_maskS(float2 p, float2 corner_size00, float2 corner_size01, float2 corner_size11, float2 corner_size10) {
  return
      in_cornerS(p, c00s, corner_size00) &&
      in_cornerS(p, c01s, corner_size01) &&
      in_cornerS(p, c10s, corner_size11) &&
      in_cornerS(p, c11s, corner_size10);
}



fragment float4 fragmentStencil(VertexIn vert [[stage_in]],
                                  device const float2 *dimensions00 [[ buffer(0) ]],
                                  device const float2 *dimensions01 [[ buffer(1) ]],
                                  device const float2 *dimensions11 [[ buffer(2) ]],
                                  device const float2 *dimensions10 [[ buffer(3) ]]) {
    float2 a_uv = vert.texCoord;
    float2 u_dimensions00 = *dimensions00;
    float2 u_dimensions01 = *dimensions01;
    float2 u_dimensions11 = *dimensions11;
    float2 u_dimensions10 = *dimensions10;
    if (!test_rounded_maskS(a_uv, u_dimensions00, u_dimensions01, u_dimensions11, u_dimensions10)) {
        discard_fragment();
    }
    return float4(1.0,1.0,1.0,1.0);
}

i get this result

but I want this

how I can achieve this ?

Maybe this would help you as a reference: https://stackoverflow.com/questions/26995884/polygon-with-rounded-corners or even better this: https://stackoverflow.com/questions/24771828/how-to-calculate-rounded-corners-for-a-polygon — o15a3d4l11s2, Mar 15 '22 at 14:57
@YvesDaoust in theory I can get corners from Bezier, but what do I do with them? I'm not that good at math — Дима Савичев, Mar 16 '22 at 05:55
@YvesDaoust so they are not needed, I can get angles through them, no more — Дима Савичев, Mar 16 '22 at 12:02

score 0 · Answer 1 · answered Mar 19 '22 at 21:07

Step 1: Follow install instructions for the Metal port of NanoVG.

Step 2: Prosper. You can now render vector shapes and paths. This will fill a path:

- (void)renderFillWithPaint:(NVGpaint*)paint
     compositeOperation:(NVGcompositeOperationState)compositeOperation
                scissor:(NVGscissor*)scissor
                 fringe:(float)fringe
                 bounds:(const float*)bounds
                  paths:(const NVGpath*)paths
                 npaths:(int)npaths;

Swift metal, corner irregular shape

1 Answers1