AppAlloy Documentation
Home
  • Glossary
  • 🚀Getting Started
    • Introduce AppAlloy Documentation
    • Build your first AppAlloy app
    • From sheet to app
  • 🗃️Data management
    • Learn data structure
    • Set up data source
      • Integrate with Google Sheets
      • Integrate with Microsoft Excel
      • Build Alloy table
      • Upload local file
    • Manage data type
    • Ultimate guide for data sheet
  • ⚒️Manage table views
    • Design Record View
    • Design Actions
      • Update current record
      • Delete current record
      • Delete many records
      • Create record
      • Open external URL
      • HTTP Request
      • Open phone call popup
      • Open SMS Popup
      • Open email popup
      • Send notification
    • Design Record Components
      • Plain Text
      • Phone number
      • Email
      • URL
      • Map
      • Barcode
      • Checkbox
      • Number
      • Currency
      • Rating
      • Voting
      • Date time
      • Relative date
      • Count Down / Count Up
      • Single Photo
      • Photo Gallery
      • Carousel
      • Audio Player
      • Video Player
      • Youtube Player
      • Vimeo Player
    • Design Form View
    • Design Form fields (synced tables)
      • Text (for synced tables)
      • Number (for synced tables)
      • Date time (for synced tables)
      • Checkbox (for synced table)
      • Options (for synced table)
      • Photos (for synced table)
      • Files (for synced table)
      • Table lookup (for synced table)
      • Signature (for synced table)
    • Design Form fields (Alloy tables)
      • Single line Text (for Alloy table)
      • Long Text (for Alloy table)
      • Phone number (for Alloy table)
      • Email (for Alloy table)
      • Barcode (for Alloy table)
      • Number (for Alloy table)
      • Currency (for Alloy table)
      • Checkbox (for Alloy table)
      • Date (for Alloy table)
      • Photos (for Alloy table)
      • Files (for Alloy table)
      • Single select (for Alloy table)
      • Multiple select (for Alloy table)
      • Address (for Alloy table)
      • Table lookup (for Alloy table)
  • 🎨Manage pages
    • Manage page types
    • Design 'View From' Page
    • Page Layouts
      • List Layout
      • Grid Layout
      • Card Layout
      • Map Layout
      • Checklist Layout
      • Calendar Layout
      • Kanban Layout
    • Design Canvas View Page
    • Canvas Charts
      • Line chart
      • Area Chart
      • Pie Chart
      • Donut Chart
      • Column chart vs. Stacked Column chart
      • Bar chart vs. Stacked bar chart
      • Table
    • Design Form of... Page
  • ⚙️Manage workflow
    • Introduce Workflow
    • Design a workflow
  • 🔌Manage Integration
    • Manage AppAlloy Integration
    • Manage Slack Integration
    • Manage Gmail Integration
    • Manage Google Drive Integration
    • Manage Google Calendar integration
  • 📱Manage App Settings
    • Manage app appearance
  • 🌎App distribution
    • Publish your app
    • Use app as Mobile Web app
    • Use app on AppAlloy Air
  • 🚹Account, team, and plan
    • Manage Account
    • Manage Apps
    • Manage Users
    • Manage Plans
    • Manage Teams
  • #️⃣Learn Power FX
    • Introduce Power FX
    • Operators & Identifiers
    • Formula References
      • Average
      • Concatenate
      • Date
      • DateAdd
      • DateDiff
      • DateValue
      • DateTimeValue
      • Day
      • If
      • Month
      • Now
      • Rand
      • RandBetween
      • Round
      • RoundDown
      • RoundUp
      • Sum
      • Text
      • Today
      • Weeknum
      • Weekday
      • Year
Powered by GitBook
On this page
  • Detailed settings
  • Title
  • Subtitle
  • Photo URL
  • Content position

Was this helpful?

  1. Manage pages
  2. Page Layouts

Card Layout

AppAlloy Card Layout option provides a larger space for each item compared to the List Layout option.

Last updated 9 months ago

Was this helpful?

It is effective for showcasing items with a visual component that benefits from a bigger image preview.

Detailed settings

Title

This is the primary text label displayed prominently within the list item. It typically represents the most crucial piece of information about the data point.

Line limitation: 1

Subtitle

The subtitle is a secondary text label that provides additional details or context to complement the title. Utilize this option to showcase supplementary information that enhances user understanding.

Line limitation: 2

Photo URL

Incorporating a photo injects a visual element into your list. There are ratio options to ensure your photos are displayed proportionally within the list item. Consider using photos that visually represent the data point (e.g., a product image for an e-commerce app).

Content position

This setting offers greater control over the layout of your card. You can choose between:

  • Block: In this configuration, the title, subtitle, and any additional content are displayed beneath the photo in a dedicated block.

  • Overlay: With the overlay option, the title and subtitle are positioned directly on top of the photo, creating a layered effect.

🎨
Design view on all records with Card layout