菜鸟教程小白 发表于 2022-12-13 11:54:26

ios - 在覆盖 UIView 的右下角创建四分之一透明孔


                                            <p><p>您好,我想在覆盖 UIView 的右下角创建一个四分之一透明孔。</p>

<p>我可以使用下面的代码来解决它。但它看起来不正确,因为我在视野之外创建了一个矩形。</p>

<p>我尝试过的:</p>

<pre><code>@implementation PartialTransparentView

- (id)initWithBottomRightCornerRadiusForView:(UIView *)view   withRadius:(CGFloat)radius
{
;
self = ;//**it does not look right to me**
if (self) {
    // Initialization code
    self.opaque = NO;
}
return self;
}

-(void)commonInitWithRect:(CGRect)rect{
    backgroundColor = ;
    rectToBeSurrounded = rect;
}
- (void)drawRect:(CGRect)rect {

    ;
    UIRectFill(rect);



      CGFloat x = rectToBeSurrounded.origin.x;
      CGFloat y = rectToBeSurrounded.origin.y;

      CGFloat width = rectToBeSurrounded.size.width;
      CGFloat height = rectToBeSurrounded.size.height;

      //create outer square
      CGFloat outerX = (x - width/2);
      CGFloat outerY = y - height/2;
      CGFloat outerWidth = 2*width;
      CGFloat outerHeight = outerWidth;
      //create outer square

      CGRect outerRect = CGRectMake(outerX, outerY, outerWidth, outerHeight);

      CGRect holeRectIntersection = CGRectIntersection( outerRect, rect );

      CGContextRef context = UIGraphicsGetCurrentContext();

      if( CGRectIntersectsRect( holeRectIntersection, rect ) )
      {
            CGContextAddEllipseInRect(context, holeRectIntersection);
            CGContextClip(context);
            CGContextClearRect(context, holeRectIntersection);
            CGContextSetFillColorWithColor( context, .CGColor );
            CGContextFillRect( context, holeRectIntersection);
      }
}
</code></pre>

<p>现在我将上面的代码用作:</p>

<pre><code>PartialTransparentView *transparentView = [ initWithBottomRightCornerRadiusForView:self.view withRadius:50];
;
</code></pre>

<p>结果如预期:</p>

<p> <a href="/image/t9JDG.png" rel="noreferrer noopener nofollow"><img src="/image/t9JDG.png" alt="OUTPUT"/></a> </p>

<p>我知道如果我必须实现相同的目标但在 View 的左上角,我的解决方案将会中断。
<strong>我正在寻找的只是提供圆的中心 (x, y) 和半径并获得所需的结果。</strong></p>

<p>谢谢
基于T先生</p>

<pre><code>UIView *transparentView = [ initWithFrame:self.view.frame];
    ];
    ;

    circleView *acircleView = [ initWithFrame:CGRectMake(50, 50, 60, 60)];
    ];
    ;
</code></pre>

<p>和circleView.m</p>

<pre><code>- (void)drawRect:(CGRect)rect {
    // Drawing code
    //// Oval Drawing
    UIBezierPath* ovalPath = ;
    ;
    ;
}
</code></pre>

<p><strong>输出:</strong>
<a href="/image/che5h.png" rel="noreferrer noopener nofollow"><img src="/image/che5h.png" alt="dont get circle , instead i am getting square"/></a> </p></p>
                                    <br><hr><h1><strong>Best Answer-推荐答案</ strong></h1><br>
                                            <p><p>我的建议是将透明 <code>view</code> 作为单独的 <code>view</code> 添加到您的 ViewController 上。这可以在 <code>storyboard</code> 上完成,这样您就可以设置背景颜色和 <code>alpha</code> 值以提供透明效果!!!</p>

<p>现在创建另一个 <code>view</code> 来制作圆形并将其添加到透明 <code>view</code> 中,并将这个 <code>view</code> 移动到透明 <code> 上查看</code>根据你的需要!!!</p>

<p>使用<code>bezier path</code>创建圆:</p>

<p><strong>circleView.m</strong> </p>

<pre><code> - (void)drawRect:(CGRect)frame {
    //// Oval Drawing
    UIBezierPath* ovalPath = ;
    ;
    ;
}
</code></pre>

<p>出于测试目的,我在我的 IB 上创建了一个圆形 View ,并在我的 ViewController 中创建了一个 socket 属性。</p>

<p>这里是截图。</p>

<p> <a href="/image/phllx.png" rel="noreferrer noopener nofollow"><img src="/image/phllx.png" alt="enter image description here"/></a> </p>

<p>现在要移动圆圈,我可以在任何需要的地方更改圆圈<code>view</code>的框架。</p>

<p>例如,如果我想将它移到左上角,我只需这样做:</p>

<pre><code>-(void)moveCircleViewwithX:(float) x withY:(float) y{

    _cView.frame=CGRectMake(x, y, _cView.frame.size.width, _cView.frame.size.height);


}
</code></pre>

<p>结果将是:</p>

<p> <a href="/image/g4NTt.png" rel="noreferrer noopener nofollow"><img src="/image/g4NTt.png" alt="enter image description here"/></a> </p>

<p><strong>更新</strong></p>

<p>把transparentView的drawRect方法如下:</p>

<pre><code>CGContextRef ctx = UIGraphicsGetCurrentContext();
CGRect transparentPart = self.seeRect;         //this is the rect of the circle view
CGContextAddEllipseInRect(ctx,transparentPart);//make the circle shape
CGContextClip(ctx);
CGContextClearRect(ctx, transparentPart);
</code></pre>

<p>在您的 ViewController 中:</p>

<p>当您想要应用蒙版时,即圆形和透明层的透明:</p>

<pre><code>-(void)applyMask{

    ];   //circle view bezier path color
    ;
    ;    //set the transparency cut on transparency view
    ;


}
</code></pre>

<p>一旦你这样做了,你会得到透明 View !!! </p>

<p>你可以通过调用来移动圆圈</p>

<pre><code>      ;   //top left corner
</code></pre>

<p>您可以通过简单地调用来应用透明蒙版:</p>

<pre><code>      ;
</code></pre>

<p>所以,调用 <code>applyMask</code> 方法后的最终结果是:</p>

<p> <a href="/image/XwLFT.png" rel="noreferrer noopener nofollow"><img src="/image/XwLFT.png" alt="enter image description here"/></a> </p></p>
                                   
                                                <p style="font-size: 20px;">关于ios - 在覆盖 UIView 的右下角创建四分之一透明孔,我们在Stack Overflow上找到一个类似的问题:
                                                        <a href="https://stackoverflow.com/questions/33924229/" rel="noreferrer noopener nofollow" style="color: red;">
                                                                https://stackoverflow.com/questions/33924229/
                                                        </a>
                                                </p>
                                       
页: [1]
查看完整版本: ios - 在覆盖 UIView 的右下角创建四分之一透明孔