Skip to content

Commit dc45eda

Browse files
farfromrefugfarfromrefug
committed
fix: bottomsheet buttons bar was not scrollable (in case there are many buttons)
1 parent 1573db2 commit dc45eda

File tree

3 files changed

+41
-38
lines changed

3 files changed

+41
-38
lines changed

‎app/NestedScrollView.ts

+3
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,9 @@ import { ScrollView } from '@nativescript/core';
33
export class NestedScrollView extends ScrollView {
44
createNativeView() {
55
if (__ANDROID__) {
6+
if (this.orientation === 'horizontal') {
7+
return new org.nativescript.widgets.HorizontalScrollView(this._context);
8+
}
69
return new androidx.core.widget.NestedScrollView(this._context);
710
}
811
return super.createNativeView();

‎app/components/bottomsheet/BottomSheetInner.svelte

+34-36
Original file line numberDiff line numberDiff line change
@@ -956,45 +956,43 @@
956956
</swipemenu>
957957

958958
<scrollview borderBottomWidth={1} borderColor={colorOutlineVariant} borderTopWidth={1} colSpan={2} orientation="horizontal" row={1}>
959-
<gridlayout columns="auto" rows="*">
960-
<stacklayout id="bottomsheetbuttons" orientation="horizontal">
961-
<IconButton isVisible={item && !itemIsRoute} rounded={false} text="mdi-information-outline" tooltip={lc('information')} on:tap={() => showInformation()} />
962-
<IconButton isVisible={itemCanBeAdded} rounded={false} text={itemIsEditingItem ? 'mdi-content-save-outline' : 'mdi-map-plus'} tooltip={lc('save')} on:tap={() => saveItem()} />
959+
<stacklayout id="bottomsheetbuttons" orientation="horizontal">
960+
<IconButton isVisible={item && !itemIsRoute} rounded={false} text="mdi-information-outline" tooltip={lc('information')} on:tap={() => showInformation()} />
961+
<IconButton isVisible={itemCanBeAdded} rounded={false} text={itemIsEditingItem ? 'mdi-content-save-outline' : 'mdi-map-plus'} tooltip={lc('save')} on:tap={() => saveItem()} />
963962

964-
<!-- {#if packageService.hasElevation()} -->
965-
<IconButton isVisible={itemIsRoute && itemCanQueryProfile} rounded={false} text="mdi-chart-areaspline" tooltip={lc('elevation_profile')} on:tap={() => getProfile()} />
966-
<!-- {/if} -->
967-
<!-- {#if packageService.offlineRoutingSearchService()} -->
968-
<IconButton isVisible={itemIsRoute && itemCanQueryStats} rounded={false} text="mdi-chart-bar-stacked" tooltip={lc('road_stats')} on:tap={() => getStats()} />
969-
<!-- {/if} -->
970-
<IconButton isVisible={!!item?.id && itemIsRoute} rounded={false} text="mdi-eye-off" tooltip={lc('hide')} on:tap={hideItem} />
971-
<IconButton isVisible={itemCanBeEdited} rounded={false} text="mdi-pencil" tooltip={lc('edit')} on:tap={startEditingItem} />
972-
<IconButton
973-
isVisible={item && (!itemIsRoute || (!!item.properties?.name && item.properties.hasRealName !== false))}
974-
onLongPress={() => searchWeb(false)}
975-
rounded={false}
976-
text="mdi-web"
977-
tooltip={lc('search_web')}
978-
on:tap={() => searchWeb()} />
979-
<IconButton isVisible={!itemIsRoute && item && item.properties && !!item.properties.name} rounded={false} text="mdi-wikipedia" tooltip={lc('wikipedia')} on:tap={openWikipedia} />
980-
{#if networkService.canCheckWeather}
981-
<IconButton isVisible={!itemIsRoute} rounded={false} text="mdi-weather-partly-cloudy" tooltip={lc('weather')} on:tap={checkWeather} />
982-
{/if}
983-
<IconButton id="astronomy" isVisible={!itemIsRoute} rounded={false} text="mdi-weather-night" tooltip={lc('astronomy')} on:tap={showAstronomy} />
984-
{#if WITH_PEAK_FINDER && __ANDROID__ && packageService.hasElevation()}
985-
<IconButton isVisible={!itemIsRoute} rounded={false} text="mdi-summit" tooltip={lc('peaks')} on:tap={openPeakFinder} />
986-
{/if}
987-
{#if WITH_3D_MAP && __ANDROID__ && packageService.hasElevation()}
988-
<IconButton isVisible={!itemIsRoute} rounded={false} text="mdi-video-3d" tooltip={lc('threed_map')} on:tap={open3DMap} />
989-
{/if}
990-
<IconButton isVisible={(itemIsRoute && !item?.id) || !!currentLocation} rounded={false} text="mdi-compass-outline" tooltip={lc('compass')} on:tap={openCompass} />
963+
<!-- {#if packageService.hasElevation()} -->
964+
<IconButton isVisible={itemIsRoute && itemCanQueryProfile} rounded={false} text="mdi-chart-areaspline" tooltip={lc('elevation_profile')} on:tap={() => getProfile()} />
965+
<!-- {/if} -->
966+
<!-- {#if packageService.offlineRoutingSearchService()} -->
967+
<IconButton isVisible={itemIsRoute && itemCanQueryStats} rounded={false} text="mdi-chart-bar-stacked" tooltip={lc('road_stats')} on:tap={() => getStats()} />
968+
<!-- {/if} -->
969+
<IconButton isVisible={!!item?.id && itemIsRoute} rounded={false} text="mdi-eye-off" tooltip={lc('hide')} on:tap={hideItem} />
970+
<IconButton isVisible={itemCanBeEdited} rounded={false} text="mdi-pencil" tooltip={lc('edit')} on:tap={startEditingItem} />
971+
<IconButton
972+
isVisible={item && (!itemIsRoute || (!!item.properties?.name && item.properties.hasRealName !== false))}
973+
onLongPress={() => searchWeb(false)}
974+
rounded={false}
975+
text="mdi-web"
976+
tooltip={lc('search_web')}
977+
on:tap={() => searchWeb()} />
978+
<IconButton isVisible={!itemIsRoute && item && item.properties && !!item.properties.name} rounded={false} text="mdi-wikipedia" tooltip={lc('wikipedia')} on:tap={openWikipedia} />
979+
{#if networkService.canCheckWeather}
980+
<IconButton isVisible={!itemIsRoute} rounded={false} text="mdi-weather-partly-cloudy" tooltip={lc('weather')} on:tap={checkWeather} />
981+
{/if}
982+
<IconButton id="astronomy" isVisible={!itemIsRoute} rounded={false} text="mdi-weather-night" tooltip={lc('astronomy')} on:tap={showAstronomy} />
983+
{#if WITH_PEAK_FINDER && __ANDROID__ && packageService.hasElevation()}
984+
<IconButton isVisible={!itemIsRoute} rounded={false} text="mdi-summit" tooltip={lc('peaks')} on:tap={openPeakFinder} />
985+
{/if}
986+
{#if WITH_3D_MAP && __ANDROID__ && packageService.hasElevation()}
987+
<IconButton isVisible={!itemIsRoute} rounded={false} text="mdi-video-3d" tooltip={lc('threed_map')} on:tap={open3DMap} />
988+
{/if}
989+
<IconButton isVisible={(itemIsRoute && !item?.id) || !!currentLocation} rounded={false} text="mdi-compass-outline" tooltip={lc('compass')} on:tap={openCompass} />
991990

992-
<IconButton isVisible={itemIsBusStop} rounded={false} text="mdi-bus" tooltip={lc('bus_stop_infos')} on:tap={getTransitLines} />
993-
<IconButton rounded={false} text="mdi-share-variant" tooltip={lc('share')} on:tap={shareItem} />
991+
<IconButton isVisible={itemIsBusStop} rounded={false} text="mdi-bus" tooltip={lc('bus_stop_infos')} on:tap={getTransitLines} />
992+
<IconButton rounded={false} text="mdi-share-variant" tooltip={lc('share')} on:tap={shareItem} />
994993

995-
<!-- <IconButton on:tap={deleteItem} tooltip={lc('delete')} isVisible={!!item?.id} color="red" text="mdi-delete" rounded={false} /> -->
996-
</stacklayout>
997-
</gridlayout>
994+
<!-- <IconButton on:tap={deleteItem} tooltip={lc('delete')} isVisible={!!item?.id} color="red" text="mdi-delete" rounded={false} /> -->
995+
</stacklayout>
998996
</scrollview>
999997
<!-- <label height={PROFILE_HEIGHT} row={2} visibility={graphAvailable ? 'visible' : 'collapse'}/> -->
1000998
<ElevationChart bind:this={elevationChart} colSpan={2} {item} row={2} visibility={graphAvailable ? 'visible' : 'collapse'} on:highlight={onChartHighlight} />

‎app/components/common/IconButton.svelte

+4-2
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@
2121
export let toggable = false;
2222
export let gray = toggable;
2323
export let isSelected = false;
24+
export let borderRadius = 4;
2425
export let text = null;
2526
export let fontFamily = $fonts.mdi;
2627
export let selectedColor = white ? 'white' : undefined;
@@ -82,7 +83,7 @@
8283
{#if __ANDROID__}
8384
<canvasview
8485
bind:this={canvas}
85-
borderRadius={shape === 'round' || (rounded && !shape) ? (height || size) / 2 : null}
86+
borderRadius={shape === 'round' || (rounded && !shape) ? (height || size) / 2 : borderRadius}
8687
disableCss={true}
8788
isUserInteractionEnabled={isEnabled}
8889
rippleColor={actualColor}
@@ -95,7 +96,8 @@
9596
use:conditionalEvent={{ condition: !!actualLongPress, event: 'longPress', callback: actualLongPress }} />
9697
{:else}
9798
<mdbutton
98-
color={isSelected ? (selectedColor || colorPrimary) : actualColor}
99+
borderRadius={shape || rounded ? null : borderRadius}
100+
color={isSelected ? selectedColor || colorPrimary : actualColor}
99101
disableCss={true}
100102
{fontFamily}
101103
{isEnabled}

0 commit comments

Comments
 (0)