readonly mode

demo/index.html

@@ -48,6 +48,13 @@ <h3>Toggle buttons can be checked and disabled</h3>
         </template>
       </demo-snippet>
 
+      <h3>Toggle buttons can be made read-only (not editable but still submitted)</h3>
+      <demo-snippet class="centered-demo">
+        <template>
+          <paper-toggle-button readonly>Read-only</paper-toggle-button>
+        </template>
+      </demo-snippet>
+
       <h3>Toggle buttons can hide the ripple effect using the <i>noink</i> attribute</h3>
       <demo-snippet class="centered-demo">
         <template>

paper-toggle-button.html

@@ -226,6 +226,11 @@
          *
          * @event iron-change
          */
+        readonly: {
+          type: Boolean,
+          value: false,
+          reflectToAttribute: true
+        }
       },
 
       listeners: {
@@ -280,6 +285,15 @@
         ripple.setAttribute('recenters', '');
         ripple.classList.add('circle', 'toggle-ink');
         return ripple;
+      },
+
+      _tapHandler: function(event) {
+        if (this.readonly) {
+          event.preventDefault();
+          return;
+        }
+        var spr = this.behaviors.find(function(b) { return b._tapHandler; });
+        if (spr) spr._tapHandler.apply(this, arguments);
       }
 
     });