mirror of
https://github.com/NativeScript/NativeScript.git
synced 2025-08-15 11:01:21 +08:00
fix(ios): opaque bars break ui layout (#6929)
* fix(ios): opaque bars break ui layout * test(): change flat action bar tests * test(): revert test flat change test
This commit is contained in:
10
apps/app/ui-tests-app/action-bar/flat-layout.xml
Normal file
10
apps/app/ui-tests-app/action-bar/flat-layout.xml
Normal file
@ -0,0 +1,10 @@
|
||||
<Page xmlns="http://schemas.nativescript.org/tns.xsd" backgroundColor="yellow">
|
||||
|
||||
<ActionBar flat="true" backgroundColor="blue">
|
||||
<Label text="flat action bar"></Label>
|
||||
</ActionBar>
|
||||
|
||||
<StackLayout backgroundColor="red">
|
||||
<Label text="lorem ipsum" backgroundColor="green"></Label>
|
||||
</StackLayout>
|
||||
</Page>
|
@ -1,10 +1,10 @@
|
||||
<Page xmlns="http://schemas.nativescript.org/tns.xsd">
|
||||
<Page xmlns="http://schemas.nativescript.org/tns.xsd" backgroundColor="yellow">
|
||||
|
||||
<ActionBar flat="true" backgroundColor="blue">
|
||||
<Label text="flat action bar"></Label>
|
||||
</ActionBar>
|
||||
|
||||
<ScrollView backgroundColor="green">
|
||||
<Label text="lorem ipsum" backgroundColor="red"></Label>
|
||||
<ScrollView backgroundColor="red">
|
||||
<Label text="lorem ipsum" backgroundColor="green"></Label>
|
||||
</ScrollView>
|
||||
</Page>
|
7
apps/app/ui-tests-app/action-bar/flat-tab-opaque-bar.ts
Normal file
7
apps/app/ui-tests-app/action-bar/flat-tab-opaque-bar.ts
Normal file
@ -0,0 +1,7 @@
|
||||
import { EventData } from "tns-core-modules/data/observable";
|
||||
import { TabView } from "tns-core-modules/ui/tab-view";
|
||||
|
||||
export function onLoaded(args: EventData) {
|
||||
const tabView = <TabView>args.object;
|
||||
tabView.ios.tabBar.translucent = false;
|
||||
}
|
13
apps/app/ui-tests-app/action-bar/flat-tab-opaque-bar.xml
Normal file
13
apps/app/ui-tests-app/action-bar/flat-tab-opaque-bar.xml
Normal file
@ -0,0 +1,13 @@
|
||||
<Page backgroundColor="yellow">
|
||||
<ActionBar flat="true" backgroundColor="blue">
|
||||
<Label text="flat action bar"></Label>
|
||||
</ActionBar>
|
||||
|
||||
<TabView androidTabsPosition="bottom" loaded="onLoaded">
|
||||
<TabViewItem title="First">
|
||||
<StackLayout backgroundColor="red">
|
||||
<Label text="First View" backgroundColor="green"/>
|
||||
</StackLayout>
|
||||
</TabViewItem>
|
||||
</TabView>
|
||||
</Page>
|
@ -1,13 +1,13 @@
|
||||
<Page xmlns="http://schemas.nativescript.org/tns.xsd">
|
||||
<Page xmlns="http://schemas.nativescript.org/tns.xsd" backgroundColor="yellow">
|
||||
|
||||
<ActionBar flat="true">
|
||||
<ActionBar flat="true" backgroundColor="blue">
|
||||
<Label text="flat action bar"></Label>
|
||||
</ActionBar>
|
||||
|
||||
<TabView selectedTabTextColor="green">
|
||||
<TabViewItem title="First">
|
||||
<GridLayout backgroundColor="red">
|
||||
<Button text="test" backgroundColor="yellow"></Button>
|
||||
<GridLayout backgroundColor="green">
|
||||
<Button text="test" backgroundColor="red"></Button>
|
||||
</GridLayout>
|
||||
</TabViewItem>
|
||||
</TabView>
|
||||
|
@ -1,9 +1,11 @@
|
||||
<Page navigatedTo="onNavigateTo" >
|
||||
<Page.actionBar>
|
||||
<ActionBar title="Flat property"/>
|
||||
</Page.actionBar>
|
||||
<StackLayout>
|
||||
<Page navigatedTo="onNavigateTo" backgroundColor="yellow">
|
||||
|
||||
<ActionBar backgroundColor="blue">
|
||||
<Label text="flat action bar"></Label>
|
||||
</ActionBar>
|
||||
|
||||
<StackLayout backgroundColor="red">
|
||||
<Button margin="30" text="change flat property" tap="changeFlatPropertyValue"/>
|
||||
<Label id="flatPropertyValue" />
|
||||
<Label id="flatPropertyValue" backgroundColor="green" />
|
||||
</StackLayout>
|
||||
</Page>
|
@ -23,6 +23,8 @@ export function loadExamples() {
|
||||
examples.set("modalShownActBar", "action-bar/modal-test-with-action-bar");
|
||||
examples.set("flat", "action-bar/flat");
|
||||
examples.set("flat-tab", "action-bar/flat-tab");
|
||||
examples.set("flat-tab-opaque-bar", "action-bar/flat-tab-opaque-bar");
|
||||
examples.set("flat-layout", "action-bar/flat-layout");
|
||||
examples.set("flat-scrollview", "action-bar/flat-scrollview");
|
||||
|
||||
return examples;
|
||||
|
@ -7,6 +7,6 @@
|
||||
<GridLayout rows="200, *" backgroundColor="blue">
|
||||
<GridLayout row="1">
|
||||
<Frame id="nestedFrame" defaultPage="ui-tests-app/nested-frames/nested-page" actionBarVisibility="never"></Frame>
|
||||
</GridLayout>>
|
||||
</GridLayout>
|
||||
</GridLayout>
|
||||
</Page>
|
Reference in New Issue
Block a user