title: A problem in using ClipRRect() in Flutter
body: <p>I have used ClipRRect for rounded corners in the UI. The ClipRRect wraps topContent and bottomContent are a stack and a Column respectively. But, the bottom corners are not round. What may be the reason behind this?</p>
  
  <p><a href="https://i.stack.imgur.com/0VnoZ.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/0VnoZ.jpg" alt="this is the screenshot"></a></p>
  
  <p>The cardModel class is used to store the image path in this case.</p>
  
  <pre><code>    class FeaturedCard extends StatelessWidget {
       final FeaturedCardModel cardModel;
       final double parallaxPercent;
  
    FeaturedCard({
      this.cardModel,
      this.parallaxPercent = 0.0, //default value
    });
  
    @override
    Widget build(BuildContext context) {
      final topContent = Stack(
        children: &lt;Widget&gt;[
          Container(
              padding: EdgeInsets.only(
                left: 10.0,
              ),
              height: MediaQuery.of(context).size.height * 0.3,
              decoration: new BoxDecoration(
                image: new DecorationImage(
                  image: new AssetImage(cardModel.imgUrl),
                  fit: BoxFit.fill,
                ),
              )),
        ],
      );
  
      final bottomContentText = Text(
        'This is the sample text',
        style: TextStyle(fontSize: 18.0),
      );
  
      final bottomContent = Container(
        height: MediaQuery.of(context).size.height * 0.5,
        width: MediaQuery.of(context).size.width,
        color: Colors.white,
        padding: EdgeInsets.all(40.0),
        child: Center(
          child:
              bottomContentText,
          ),
        );
  
      return ClipRRect(
        borderRadius: BorderRadius.circular(16.0),
        child: Column(
          children: &lt;Widget&gt;[
            topContent,
            bottomContent,
          ],
        ),
      );
     }
    }
  </code></pre>