mirror of
https://github.com/Novaloop-AG/element-x-ios.git
synced 2026-11-03 16:10:20 +00:00
Improve LocationRoomTimelineView layout (#1212)
* Improve LocationRoomTimelineView * Cleanup
This commit is contained in:
@@ -24,48 +24,51 @@ struct MapLibreStaticMapView<PinAnnotation: View>: View {
|
|||||||
private let mapTilerAttributionPlacement: MapTilerAttributionPlacement
|
private let mapTilerAttributionPlacement: MapTilerAttributionPlacement
|
||||||
private let pinAnnotationView: PinAnnotation
|
private let pinAnnotationView: PinAnnotation
|
||||||
@Environment(\.colorScheme) private var colorScheme
|
@Environment(\.colorScheme) private var colorScheme
|
||||||
private let imageSize: CGSize
|
|
||||||
@State private var fetchAttempt = 0
|
@State private var fetchAttempt = 0
|
||||||
|
|
||||||
init(coordinates: CLLocationCoordinate2D,
|
init(coordinates: CLLocationCoordinate2D,
|
||||||
zoomLevel: Double,
|
zoomLevel: Double,
|
||||||
imageSize: CGSize,
|
|
||||||
attributionPlacement: MapTilerAttributionPlacement,
|
attributionPlacement: MapTilerAttributionPlacement,
|
||||||
mapTilerStatic: MapTilerStaticMapProtocol,
|
mapTilerStatic: MapTilerStaticMapProtocol,
|
||||||
@ViewBuilder pinAnnotationView: () -> PinAnnotation) {
|
@ViewBuilder pinAnnotationView: () -> PinAnnotation) {
|
||||||
self.coordinates = coordinates
|
self.coordinates = coordinates
|
||||||
self.zoomLevel = zoomLevel
|
self.zoomLevel = zoomLevel
|
||||||
self.mapTilerStatic = mapTilerStatic
|
self.mapTilerStatic = mapTilerStatic
|
||||||
self.imageSize = imageSize
|
|
||||||
mapTilerAttributionPlacement = attributionPlacement
|
mapTilerAttributionPlacement = attributionPlacement
|
||||||
self.pinAnnotationView = pinAnnotationView()
|
self.pinAnnotationView = pinAnnotationView()
|
||||||
}
|
}
|
||||||
|
|
||||||
var body: some View {
|
var body: some View {
|
||||||
if let url = mapTilerStatic.staticMapURL(for: colorScheme.mapStyle, coordinates: coordinates, zoomLevel: zoomLevel, size: imageSize, attribution: mapTilerAttributionPlacement) {
|
GeometryReader { geometry in
|
||||||
AsyncImage(url: url) { phase in
|
if let url = mapTilerStatic.staticMapURL(for: colorScheme.mapStyle,
|
||||||
switch phase {
|
coordinates: coordinates,
|
||||||
case .empty:
|
zoomLevel: zoomLevel,
|
||||||
Image("mapBlurred")
|
size: geometry.size,
|
||||||
.resizable()
|
attribution: mapTilerAttributionPlacement) {
|
||||||
.aspectRatio(contentMode: .fill)
|
AsyncImage(url: url) { phase in
|
||||||
case .success(let image):
|
switch phase {
|
||||||
ZStack {
|
case .empty:
|
||||||
image
|
Image("mapBlurred")
|
||||||
.resizable()
|
.resizable()
|
||||||
.aspectRatio(contentMode: .fill)
|
.aspectRatio(contentMode: .fill)
|
||||||
pinAnnotationView
|
case .success(let image):
|
||||||
|
ZStack {
|
||||||
|
image
|
||||||
|
.resizable()
|
||||||
|
.aspectRatio(contentMode: .fill)
|
||||||
|
pinAnnotationView
|
||||||
|
}
|
||||||
|
case .failure:
|
||||||
|
errorView
|
||||||
|
@unknown default:
|
||||||
|
EmptyView()
|
||||||
}
|
}
|
||||||
case .failure:
|
|
||||||
errorView
|
|
||||||
@unknown default:
|
|
||||||
EmptyView()
|
|
||||||
}
|
}
|
||||||
|
.id(fetchAttempt)
|
||||||
|
.clipped()
|
||||||
|
} else {
|
||||||
|
Image("mapBlurred")
|
||||||
}
|
}
|
||||||
.id(fetchAttempt)
|
|
||||||
.clipped()
|
|
||||||
} else {
|
|
||||||
Image("mapBlurred")
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -101,7 +104,6 @@ struct MapLibreStaticMapView_Previews: PreviewProvider {
|
|||||||
static var previews: some View {
|
static var previews: some View {
|
||||||
MapLibreStaticMapView(coordinates: CLLocationCoordinate2D(),
|
MapLibreStaticMapView(coordinates: CLLocationCoordinate2D(),
|
||||||
zoomLevel: 15,
|
zoomLevel: 15,
|
||||||
imageSize: .init(width: 300, height: 200),
|
|
||||||
attributionPlacement: .bottomLeft,
|
attributionPlacement: .bottomLeft,
|
||||||
mapTilerStatic: MapTilerStaticMapMock()) {
|
mapTilerStatic: MapTilerStaticMapMock()) {
|
||||||
Image(systemName: "mappin.circle.fill")
|
Image(systemName: "mappin.circle.fill")
|
||||||
|
|||||||
@@ -23,11 +23,11 @@ struct LocationRoomTimelineView: View {
|
|||||||
var body: some View {
|
var body: some View {
|
||||||
TimelineStyler(timelineItem: timelineItem) {
|
TimelineStyler(timelineItem: timelineItem) {
|
||||||
if let geoURI = timelineItem.content.geoURI {
|
if let geoURI = timelineItem.content.geoURI {
|
||||||
let mapSize: CGSize = .init(width: 292, height: 188)
|
MapLibreStaticMapView(geoURI: geoURI) {
|
||||||
MapLibreStaticMapView(geoURI: geoURI, size: mapSize) {
|
|
||||||
LocationMarkerView()
|
LocationMarkerView()
|
||||||
}
|
}
|
||||||
.frame(width: mapSize.width, height: mapSize.height)
|
.frame(maxHeight: 300)
|
||||||
|
.aspectRatio(3 / 2, contentMode: .fit)
|
||||||
} else {
|
} else {
|
||||||
FormattedBodyText(text: timelineItem.body)
|
FormattedBodyText(text: timelineItem.body)
|
||||||
}
|
}
|
||||||
@@ -36,10 +36,9 @@ struct LocationRoomTimelineView: View {
|
|||||||
}
|
}
|
||||||
|
|
||||||
private extension MapLibreStaticMapView {
|
private extension MapLibreStaticMapView {
|
||||||
init(geoURI: GeoURI, size: CGSize, @ViewBuilder pinAnnotationView: () -> PinAnnotation) {
|
init(geoURI: GeoURI, @ViewBuilder pinAnnotationView: () -> PinAnnotation) {
|
||||||
self.init(coordinates: .init(latitude: geoURI.latitude, longitude: geoURI.longitude),
|
self.init(coordinates: .init(latitude: geoURI.latitude, longitude: geoURI.longitude),
|
||||||
zoomLevel: 15,
|
zoomLevel: 15,
|
||||||
imageSize: size,
|
|
||||||
attributionPlacement: .bottomLeft,
|
attributionPlacement: .bottomLeft,
|
||||||
mapTilerStatic: MapTilerStaticMap(key: ServiceLocator.shared.settings.mapTilerApiKey,
|
mapTilerStatic: MapTilerStaticMap(key: ServiceLocator.shared.settings.mapTilerApiKey,
|
||||||
lightURL: ServiceLocator.shared.settings.lightTileMapStyleURL,
|
lightURL: ServiceLocator.shared.settings.lightTileMapStyleURL,
|
||||||
|
|||||||
Reference in New Issue
Block a user