Warning: Use of undefined constant MDB_STRIPE_SUB_WEBHOOK_SECRET - assumed 'MDB_STRIPE_SUB_WEBHOOK_SECRET' (this will throw an Error in a future version of PHP) in /var/www/acc01/wp-content/themes/mdbootstrap4/inc/mdb-subscriptions/mdb-payments/stripe/class-mdb-stripe-webhook.php on line 26

Notice: Undefined index: HTTP_REFERER in /var/www/acc01/wp-content/themes/mdbootstrap4/inc/cookie-setter.php on line 8
Angular Mobile Masks - Bootstrap 4 & Material Design. - Material Design for Bootstrap

Angular Mobile masks

Angular Mobile Masks - Bootstrap 4 & Material Design

Angular Mobile Bootstrap masks alter the visibility of an element by either partially or fully hiding it. Masks are used to make content more visible in the picture.


Basic example

Android
Android mask
iOS
iOS mask

          <StackLayout>
            <MDBMask overlay="light">
              <Image
                src="https://mdbootstrap.com/img/Photos/Horizontal/Nature/8-col/img (121).jpg"
                id="userIcon"
                stretch="aspectFill"
                width="100%"
                MDBWavesEffect
              >
              </Image>
            </MDBMask>
          </StackLayout>
        

Overlays

There are three types of overlays available: slight, light and strong. Use overlay input to add specific overlay to the element.

Android
Android mask
iOS
iOS mask

        <StackLayout>
          <MDBMask overlay="strong">
            <Image
              src="https://mdbootstrap.com/img/Photos/Horizontal/Nature/8-col/img (121).jpg"
              id="userIcon"
              stretch="aspectFill"
              width="100%"
              MDBWavesEffect
            >
            </Image>
          </MDBMask>
        </StackLayout>
      

Angular Mobile Masks - API

In this section you will find informations about masks and its required modules and available inputs, outputs, methods and events.


Modules used

In order to speed up your application, you can choose to import only the modules you actually need, instead of importing the entire MDB Angular Mobile library. Remember that importing the entire library, and immediately afterwards a specific module, is bad practice, and can cause application errors.


    // MDB Angular Mobile Free
    import { MdbMaskModule } from 'mdb-angular-mobile'
  

Components

MdbMask

Selector: MDBMask

Type: MdbMaskComponent


Inputs

Name Type Default Description Example
overlay string slight Allow to change overlay type (slight, light, strong). overlay="strong"