title: Making the bottom sheet disappear when tapping outside it
body: <p>I have a bottom sheet in my page. I want to dismiss it when I click outside of it, how to achieve this?</p>
  
  <p>I'm doing it like this:</p>
  
  <pre><code>return new Directionality(
    textDirection: TextDirection.rtl,
    child: new Theme(
      data: theme,
      child: new Scaffold(
        bottomSheet: Container(
          height: MediaQuery.of(context).size.height / 3 + 35,
          color:
              Color(0x00737373), // This line set the transparent background
          child: Padding(
            padding: EdgeInsets.only(right: 10.0, left: 10.0),
            child: Container(
                height: double.infinity,
                width: double.infinity,
                decoration: BoxDecoration(
                    color: Color(0xcc2BA04F),
                    borderRadius: BorderRadius.only(
                        topLeft: Radius.circular(16.0),
                        topRight: Radius.circular(16.0))),
                child: ....
                )),
          ),
        ),
        body: 
          ...
  </code></pre>
  
  <p>If I touched outside the bottom sheet it will not dismiss by default. How to make it disappear when tapping outside of it?</p>