Gap between two connected UIViews with cornerRadius while animating - ios

Question

I want to create a tipsView with a pop animate like this:
tips
But as the gif show, there is a very thin gap between the two connected view while animating;
Then I made a demo to find out the main cause and finally got the cornerRadius property. Here is demo code:
- (void)viewDidLoad {
[super viewDidLoad];
self.containerView = [[UIView alloc] initWithFrame:CGRectMake(100, 100, 214, 40)];
[self.view addSubview:self.containerView];
self.subView1 = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 214, 34)];
self.subView1.backgroundColor = [UIColor grayColor];
self.subView1.layer.cornerRadius = 6.0;
self.subView1.layer.masksToBounds = YES;
[self.containerView addSubview:self.subView1];
self.subView2 = [[UIView alloc] initWithFrame:CGRectMake(100, 34, 14, 6)];
self.subView2.backgroundColor = [UIColor darkGrayColor];
[self.containerView addSubview:self.subView2];
self.containerView.transform = CGAffineTransformMakeScale(0.01, 0.01);
UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc]initWithTarget:self action:#selector(tap:)];
[self.view addGestureRecognizer:tap];
}
- (void)tap:(UITapGestureRecognizer *)sender {
[UIView animateWithDuration:10 animations:^{
self.containerView.transform = CGAffineTransformIdentity;
} completion:^(BOOL finished) {
[UIView animateWithDuration:10 animations:^{
self.containerView.transform = CGAffineTransformMakeScale(0.01, 0.01);
}];
}];
}
The gif:
demo
and once I delete the line which used to set the cornerRadius property（or just set to 0）, its behavior was in line with expectations. The gif after deleting:
demo after deleting
I wander why the cornerRadius property cause this result, and how I can fix it.
I find a similar question and the solution here, but I don't want to combine two views into one with bezier curve.