Skip to content

Commit

Permalink
Reworked Retina Tiles page config options to add flexibility for manu…
Browse files Browse the repository at this point in the history 
…al testing

Fixed attribution on Retina Tiles page
  • Loading branch information
@JaffaKetchup
JaffaKetchup committed Sep 27, 2023
1 parent 10315eb commit b5f50fd
Showing 1 changed file with 122 additions and 87 deletions.
209 changes: 122 additions & 87 deletions example/lib/pages/retina.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,121 +14,156 @@ class RetinaPage extends StatefulWidget {
}

class _RetinaPageState extends State<RetinaPage> {
bool? retina = false;
double tileSize = 256;
bool fmRetina = false;
bool urlRetina = false;
double fmTileSize = 256;
double urlTileSize = 256;

@override
Widget build(BuildContext context) {
// The default for retina is based on the screen
retina ??= MediaQuery.of(context).devicePixelRatio > 1;

return Scaffold(
appBar: AppBar(title: const Text('Retina Tiles (@2x)')),
appBar: AppBar(title: const Text('Retina Tiles')),
drawer: buildDrawer(context, RetinaPage.route),
body: Column(
children: [
Padding(
padding: const EdgeInsets.all(8),
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Text('Retina'),
const SizedBox(width: 10),
Switch.adaptive(
value: retina!,
onChanged: (v) => setState(() => retina = v),
),
],
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Text('Tile Size'),
const SizedBox(width: 10),
DropdownMenu<double>(
initialSelection: 256,
dropdownMenuEntries: const [
DropdownMenuEntry(label: '256', value: 256),
DropdownMenuEntry(label: '512', value: 512),
],
enableSearch: false,
enableFilter: false,
onSelected: (double? tileSize) {
if (tileSize == null) return;
setState(() {
this.tileSize = tileSize;
});
},
),
],
),
],
child: IntrinsicHeight(
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Column(
children: [
const Text(
'flutter_map Settings',
style: TextStyle(fontWeight: FontWeight.bold),
),
const SizedBox.square(dimension: 10),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Text('Simulate Retina'),
const SizedBox.square(dimension: 10),
Switch.adaptive(
value: fmRetina,
onChanged: (v) => setState(() => fmRetina = v),
),
],
),
const SizedBox.square(dimension: 10),
DropdownMenu<double>(
label: const Text('Tile Size'),
leadingIcon: const Icon(Icons.photo_size_select_large),
initialSelection: 256,
enableSearch: false,
dropdownMenuEntries: const [
DropdownMenuEntry(label: '256px', value: 256),
DropdownMenuEntry(label: '512px', value: 512),
],
onSelected: (tileSize) {
if (tileSize == null) return;
setState(() => fmTileSize = tileSize);
},
),
],
),
const VerticalDivider(width: 42),
Column(
children: [
const Text(
'URL Options',
style: TextStyle(fontWeight: FontWeight.bold),
),
const SizedBox.square(dimension: 10),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Text('"@2x" Retina'),
const SizedBox.square(dimension: 10),
Switch.adaptive(
value: urlRetina,
onChanged: (v) => setState(() => urlRetina = v),
),
],
),
const SizedBox.square(dimension: 10),
DropdownMenu<double>(
label: const Text('Tile Size'),
leadingIcon: const Icon(Icons.photo_size_select_large),
initialSelection: 256,
enableSearch: false,
dropdownMenuEntries: const [
DropdownMenuEntry(label: '256px', value: 256),
DropdownMenuEntry(label: '512px', value: 512),
],
onSelected: (tileSize) {
if (tileSize == null) return;
setState(() => urlTileSize = tileSize);
},
),
],
),
],
),
),
),
Flexible(
Expanded(
child: FlutterMap(
options: const MapOptions(
initialCenter: LatLng(51.5, -0.09),
initialZoom: 5,
),
nonRotatedChildren: [
Align(
alignment: Alignment.bottomLeft,
child: LogoSourceAttribution(
Image.asset("assets/mapbox-logo-white.png"),
height: 16,
),
),
Align(
alignment: Alignment.bottomRight,
child: DefaultTextStyle(
style: const TextStyle(color: Colors.white),
child: Padding(
padding: const EdgeInsets.all(6),
child: Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
TextSourceAttribution(
'Mapbox',
onTap: () => launchUrl(Uri.parse(
'https://www.mapbox.com/about/maps/')),
),
const SizedBox(width: 10),
TextSourceAttribution(
'OpenStreetMap',
onTap: () => launchUrl(Uri.parse(
'https://www.openstreetmap.org/copyright')),
),
const SizedBox(width: 10),
TextSourceAttribution(
'Improve this map',
prependCopyright: false,
onTap: () => launchUrl(
// TODO This URL can end in #/-74.5/40/10 to specify
// the location. Make this change automagically.
Uri.parse(
'https://www.mapbox.com/map-feedback/')),
),
],
RichAttributionWidget(
attributions: [
LogoSourceAttribution(
Image.asset(
"assets/mapbox-logo-white.png",
color: Colors.black,
),
height: 16,
),
),
TextSourceAttribution(
'Mapbox',
onTap: () => launchUrl(
Uri.parse('https://www.mapbox.com/about/maps/')),
),
TextSourceAttribution(
'OpenStreetMap',
onTap: () => launchUrl(
Uri.parse('https://www.openstreetmap.org/copyright')),
),
TextSourceAttribution(
'Improve this map',
prependCopyright: false,
onTap: () => launchUrl(
// TODO This URL can end in #/-74.5/40/10 to specify
// the location. Make this change automagically.
Uri.parse('https://www.mapbox.com/map-feedback/')),
),
],
),
],
children: [
TileLayer(
tileSize: tileSize,
urlTemplate:
'https://api.mapbox.com/styles/v1/mapbox/satellite-v9/tiles/{tileSize}/{z}/{x}/{y}{r}?access_token={accessToken}',
'https://api.mapbox.com/styles/v1/mapbox/satellite-v9/tiles/{urlTileSize}/{z}/{x}/{y}{urlRetinaMode}?access_token={accessToken}',
userAgentPackageName: 'dev.fleaflet.flutter_map.example',
additionalOptions: const {
'tileSize': '512',
additionalOptions: {
'urlTileSize': urlTileSize.toStringAsFixed(0),
'urlRetinaMode': urlRetina ? '{r}' : '',
'accessToken':
'pk.eyJ1IjoiYnJhbXAiLCJhIjoiY2o4b3NnamZnMDhoMjMzcno4M3JrNm4wMSJ9.R8ove2k7wvRVVdEnlTUu4A',
},
retinaMode: retina!,
retinaMode: fmRetina,
tileSize: fmTileSize,
tileBuilder: (context, tileWidget, _) => DecoratedBox(
decoration: BoxDecoration(
border: Border.all(width: 2, color: Colors.white),
),
position: DecorationPosition.foreground,
child: tileWidget,
),
)
],
),
Expand Down

0 comments on commit b5f50fd

Please sign in to comment.