coderqh

Lodgora — Flutter Hotel Booking App UI Kit

Hotel booking with a hand-drawn date-range calendar, room rate cards and an itemized price summary, on real stay photos.

Lodgora — Flutter Hotel Booking App UI Kit

The live preview on CodeCanyon is this app compiled for the web: the real build, not a video.

Lodgora is the guest side of a hotel or vacation rental app. Guests explore a featured hero, popular destinations and stay styles from beachfront to cabin, search and filter, then open a hotel with a full-width gallery, amenities, reviews and rate cards for each room type. The calendar lets them pick check-in and check-out across several months, highlights the span and counts the nights as they go; it is written in Dart rather than pulled from a package.

The booking summary breaks the total into nightly rate times nights plus taxes and fees, then confirms with a code. Trips keeps upcoming and past stays with an itinerary timeline. Royalty-free hotel photos ship in the box, and the coastal palette of ocean teal, warm sand and sunset coral is set from central tokens.

Features

  • Multi-month date-range calendar with a highlighted stay, live night count and past dates disabled
  • Hotel detail with a photo gallery, star rating, reviews, amenities grid and room rate cards
  • Booking summary with room choice, guest and room steppers and an itemized price breakdown
  • Confirmation code, then Trips with upcoming and past stays and an itinerary timeline
  • Map view with price pins, plus saved stays and address management
  • Explore tab with destinations and stay-style categories
  • Bundled royalty-free hotel photography with a per-file source and license list
  • One image widget that tries a bundled asset, then a network URL, then a gradient placeholder
  • Offline HTML documentation plus a README covering theming and API hookup

What it looks like

9 images
Lodgora coastal palette, typography and components — Lodgora
Lodgora coastal palette, typography and components
Explore and hotel screens in light and dark theme — Lodgora
Explore and hotel screens in light and dark theme
Hotel detail with photo gallery and room rate cards — Lodgora
Hotel detail with photo gallery and room rate cards
Hotel search results with filters — Lodgora
Hotel search results with filters
Date-range calendar with check-in, check-out and night count — Lodgora
Date-range calendar with check-in, check-out and night count
Booking summary with guests and price breakdown — Lodgora
Booking summary with guests and price breakdown
Trips list and booking detail with itinerary — Lodgora
Trips list and booking detail with itinerary
Profile, saved stays and account screens — Lodgora
Profile, saved stays and account screens
Every Lodgora screen on one overview sheet — Lodgora
Every Lodgora screen on one overview sheet

Who it is for

  • You are building a booking app for hotels, resorts, villas or rentals and need the guest journey done.
  • You make travel apps for clients and want a polished, photo-led demo they can try on their phones.
  • You need a date-range picker you can restyle freely because it is plain Flutter code in your project.

In the box

from the shipped zip
  • Full Flutter source in travel_ui_kit/, no obfuscation and no licence server
  • Offline HTML documentation: setup, re-theming, app name and bundle id, troubleshooting
  • 9 Dart test files in the app

Run it after download

the app
# unzip the download, then
$ cd travel_ui_kit
$ flutter pub get
$ flutter run

Setup, including any keys or services the app talks to, is covered step by step in the bundled documentation.

Spec

measured
Screen widgets21
Dart files91
Tests in the package9
Dart SDK^3.7.0
Back endNone bundled; the service layer is where yours goes
PlatformsiOS + Android, one codebase

Counted from lodgora-v1.1.zip, the file uploaded to CodeCanyon. Screen widgets are the view, screen and page classes in the source, so the number can differ slightly from a count of routes.

Questions

Something else? Ask on the item's CodeCanyon page; the author answers there.

Where do real hotels and availability come from?

The kit runs on one bundled demo data file with 8 hotels, room types, amenities and reviews, served through mock services with Future signatures. Swap those methods for your booking API; the image widget already accepts network URLs.

Can I use the bundled photos in my released app?

They are royalty-free stock included as demo content, and each file's source and license is listed in assets/images/LICENSES.txt. Check that list, and plan to use your own property photos in production.

What does a Regular licence allow?

One end product, which may be built for a client.

See Lodgora on CodeCanyon →

Sold on Envato's CodeCanyon marketplace, which handles payment, VAT, invoices and the download.