• << Fire OS Developer Docs
• Get Started
  • Get Started with Fire Tablets
  • Set Up Your Development Environment for Fire Tablets
  • Create Your First Fire Tablet App
  • Connect to Fire Tablet through ADB
  • Get started with Amazon Stylus SDK
  • UX Specifications
  • User Agent Strings for Fire Tablets
  • Supported Android Intents
  • FAQs for Fire Tablets
• Fire OS for Fire Tablets
  • Fire OS 8 for Fire Tablets
  • Fire OS 7 for Fire Tablets
  • Fire OS 6 for Fire Tablets
• Android Apps
  • Screen Layout and Resolution
  • Device Orientation
  • Soft Key Bar
  • Button Size and Placement
  • Graphics Performance
  • Data Transfers and Mobile Networks
  • Launcher Icon Guidelines
  • App Installation Location
  • Advertising ID
  • Resources for International Locales
• Test your Android Apps
  • Run Your App on a Fire Tablet
  • Test Without an Amazon Device
  • Take Screenshots on Fire Tablets
• Web Apps
  • Get Started with Web Apps
  • Set up Development Environment
  • Best Practices for Developing Web Apps
  • Web App FAQs
  • Detect the Device Display Characteristics
  • Force the Device Orientation
  • Handle Device Orientation
  • Automatically Scale an Element to Fill the Screen
  • HTTP Caching
  • Protect Your Web App
  • Capture Media from Device Sensors
  • Use Geolocation Data
• Test Your Web Apps
  • Install and Use the Amazon Web App Tester
  • Debug Your Web App
  • Use the Debug APK to Test Your App
• HTML5 Hybrid Apps
  • HTML5 Hybrid Apps
  • Build and Test Your HTML5 Hybrid App
  • HTML5 Hybrid App FAQs
• React Native for Fire Tablet
  • Get Started with React Native (Fire Tablets)
  • Supported React Native Libraries (Fire Tablets)
• Accessibility
  • Assistive Technologies for Fire OS
  • Implement Accessibility in Fire OS
  • Accessibility Features
    • Implement Reading and Subscribing to AD/CC Settings

Button Size and Placement (Fire Tablets)

Choosing appropriate button sizes and layouts can help users reliably interact with your app on the Fire tablets.

• Button Size
• Touch Targets

Button Size

When designing the user interface for your app, specify size using density-independent pixels (dp). Using dp allows you to enter one set of values to define the button size across devices. For information about choosing dp values that work well for all devices, see the Android design guide for 48dp Rhythm.

Use the following formula to convert from density-independent pixels to millimeters:

mm = (dp*25.4)*(density/pixel density)

The following example shows a conversion for Fire HD 8 (2015):

mm = dp*25.4*(1.33/189)

mm = dp/5.595 Therefore, a button width of 48 db results in a button 8.6 mm wide on this tablet.

Important: Although dp allows you to specify one set of dimensions to be adapted across devices, you still must provide multiple graphics resources. For more information, see Screen Layout and Resolution.

Touch Targets

The touch target is the area that responds to touch and activates the button. For each button, you must make the touch target large enough for the user to reliably activate the button, which means that it may need to be larger than the visible area. The following example shows a button with a touch target larger than the visible area.

Make sure to provide additional space between the touch targets for adjacent user interface elements. For information about what size to make touch targets and how much space to allow between them, see 48 dp Rhythm.

---

Last updated: Oct 29, 2020