javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-08-16 03:31:45 +08:00
Code Issues Packages Projects Releases Wiki Activity

Class atribute registered and used instead cssClass

Browse Source
This commit is contained in:
Vladimir Enchev
2015-09-18 09:47:55 +03:00
parent 601dffcbab
commit 744de9670e
19 changed files with 63 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/action-bar-demo/main-page.xml
View File

@ -1,7 +1,7 @@
<?xml version="1.0" encoding="UTF-8" ?> <?xml version="1.0" encoding="UTF-8" ?>
<Page> <Page>
<Page.actionBar> <Page.actionBar>
<ActionBar title="Title" cssClass="custom-action-bar"> <ActionBar title="Title" class="custom-action-bar">
<ActionBar.actionItems> <ActionBar.actionItems>
<ActionItem text="hi" /> <ActionItem text="hi" />
</ActionBar.actionItems> </ActionBar.actionItems>

2
apps/cuteness.io/details-page.xml
View File

@ -3,7 +3,7 @@
<ScrollView> <ScrollView>
<StackLayout> <StackLayout>
<Image imageSource="{{ imageSource }}" stretch="aspectFill"/> <Image imageSource="{{ imageSource }}" stretch="aspectFill"/>
<Label text="{{ title }}" cssClass="detailsTitle" textWrap="true" /> <Label text="{{ title }}" class="detailsTitle" textWrap="true" />
</StackLayout> </StackLayout>
</ScrollView> </ScrollView>
<StackLayout orientation="horizontal" row="1"> <StackLayout orientation="horizontal" row="1">

8
apps/cuteness.io/main-page.xml
View File

@ -7,10 +7,10 @@
<ListView.itemTemplate> <ListView.itemTemplate>
<!-- Binding in template property of an component will use the bindingContext provided by the component. --> <!-- Binding in template property of an component will use the bindingContext provided by the component. -->
<GridLayout columns="auto, *, auto" rows="auto, 25"> <GridLayout columns="auto, *, auto" rows="auto, 25">
<Image src="{{ thumbnailImage }}" cssClass="thumbnail" rowSpan="2"/> <Image src="{{ thumbnailImage }}" class="thumbnail" rowSpan="2"/>
<Label text="{{ title || 'Downloading...' }}" textWrap="true" cssClass="title" col="1" colSpan="2" minHeight="50" /> <Label text="{{ title || 'Downloading...' }}" textWrap="true" class="title" col="1" colSpan="2" minHeight="50" />
<Label text="{{ author ? 'by ' + author : '' }}" cssClass="author" col="1" row="1" /> <Label text="{{ author ? 'by ' + author : '' }}" class="author" col="1" row="1" />
<Label text="{{ num_comments ? num_comments + ' comments' : '' }}" cssClass="comments" col="2" row="1" /> <Label text="{{ num_comments ? num_comments + ' comments' : '' }}" class="comments" col="2" row="1" />
</GridLayout> </GridLayout>
<!-- End of tempplate. --> <!-- End of tempplate. -->
</ListView.itemTemplate> </ListView.itemTemplate>

2
apps/cuteness.unoptimized/details-page.xml
View File

@ -3,7 +3,7 @@
<ScrollView> <ScrollView>
<StackLayout> <StackLayout>
<Image imageSource="{{ imageSource }}" stretch="aspectFill"/> <Image imageSource="{{ imageSource }}" stretch="aspectFill"/>
<Label text="{{ title }}" cssClass="detailsTitle" textWrap="true" /> <Label text="{{ title }}" class="detailsTitle" textWrap="true" />
</StackLayout> </StackLayout>
</ScrollView> </ScrollView>
<StackLayout orientation="horizontal" row="1"> <StackLayout orientation="horizontal" row="1">

8
apps/cuteness.unoptimized/main-page.xml
View File

@ -7,10 +7,10 @@
<ListView.itemTemplate> <ListView.itemTemplate>
<!-- Binding in template property of an component will use the bindingContext provided by the component. --> <!-- Binding in template property of an component will use the bindingContext provided by the component. -->
<GridLayout columns="auto, *, auto" rows="auto, 25"> <GridLayout columns="auto, *, auto" rows="auto, 25">
<Image src="{{ thumbnailImage }}" cssClass="thumbnail" rowSpan="2"/> <Image src="{{ thumbnailImage }}" class="thumbnail" rowSpan="2"/>
<Label text="{{ title || 'Downloading...' }}" textWrap="true" cssClass="title" col="1" colSpan="2" minHeight="50" /> <Label text="{{ title || 'Downloading...' }}" textWrap="true" class="title" col="1" colSpan="2" minHeight="50" />
<Label text="{{ author ? 'by ' + author : '' }}" cssClass="author" col="1" row="1" /> <Label text="{{ author ? 'by ' + author : '' }}" class="author" col="1" row="1" />
<Label text="{{ num_comments ? num_comments + ' comments' : '' }}" cssClass="comments" col="2" row="1" /> <Label text="{{ num_comments ? num_comments + ' comments' : '' }}" class="comments" col="2" row="1" />
</GridLayout> </GridLayout>
<!-- End of tempplate. --> <!-- End of tempplate. -->
</ListView.itemTemplate> </ListView.itemTemplate>

6
apps/gallery-app/main-page.xml
View File

@ -2,7 +2,7 @@
<Page> <Page>
<ScrollView> <ScrollView>
<StackLayout> <StackLayout>
<Label cssClass="title" text="Layouts" /> <Label class="title" text="Layouts" />
<StackLayout> <StackLayout>
<Button tag="layouts/stack-layout" text="StackLayout" tap="itemTap" /> <Button tag="layouts/stack-layout" text="StackLayout" tap="itemTap" />
<Button tag="layouts/grid-layout" text="GridLayout" tap="itemTap" /> <Button tag="layouts/grid-layout" text="GridLayout" tap="itemTap" />
@ -11,7 +11,7 @@
<Button tag="layouts/absolute-layout" text="AbsoluteLayout" tap="itemTap" /> <Button tag="layouts/absolute-layout" text="AbsoluteLayout" tap="itemTap" />
</StackLayout> </StackLayout>
<Label cssClass="title" text="Content" /> <Label class="title" text="Content" />
<StackLayout> <StackLayout>
<Button tag="content/tab-view" text="TabView" tap="itemTap" /> <Button tag="content/tab-view" text="TabView" tap="itemTap" />
<Button tag="content/web-view" text="WebView" tap="itemTap" /> <Button tag="content/web-view" text="WebView" tap="itemTap" />
@ -20,7 +20,7 @@
<Button tag="content/border" text="Border" tap="itemTap" /> <Button tag="content/border" text="Border" tap="itemTap" />
</StackLayout> </StackLayout>
<Label cssClass="title" text="Views" /> <Label class="title" text="Views" />
<StackLayout> <StackLayout>
<Button tag="views/button" text="Button" tap="itemTap" /> <Button tag="views/button" text="Button" tap="itemTap" />
<Button tag="views/label" text="Label" tap="itemTap" /> <Button tag="views/label" text="Label" tap="itemTap" />

8
apps/paylocity/login.xml
View File

@ -2,10 +2,10 @@
<StackLayout> <StackLayout>
<StackLayout verticalAlignment="center" horizontalAlignment="center" margin="50"> <StackLayout verticalAlignment="center" horizontalAlignment="center" margin="50">
<Image loaded="imageLoaded" /> <Image loaded="imageLoaded" />
<TextField cssClass="nameField" text="Captain" margin="10" /> <TextField class="nameField" text="Captain" margin="10" />
<TextField cssClass="familyNameField" text="America" margin="10" /> <TextField class="familyNameField" text="America" margin="10" />
<TextField cssClass="passwordField" secure="true" hint="Password (leave empty)" margin="10" /> <TextField class="passwordField" secure="true" hint="Password (leave empty)" margin="10" />
<Button cssClass="loginButton" text="Login" margin="10" tap="loginButtonTap" /> <Button class="loginButton" text="Login" margin="10" tap="loginButtonTap" />
</StackLayout> </StackLayout>
</StackLayout> </StackLayout>
</Page> </Page>

4
apps/template-hello-world/main-page.xml
View File

@ -1,7 +1,7 @@
<Page xmlns="http://www.nativescript.org/tns.xsd" loaded="pageLoaded"> <Page xmlns="http://www.nativescript.org/tns.xsd" loaded="pageLoaded">
<StackLayout> <StackLayout>
<Label text="Tap the button" cssClass="title"/> <Label text="Tap the button" class="title"/>
<Button text="TAP" tap="{{ tapAction }}" /> <Button text="TAP" tap="{{ tapAction }}" />
<Label text="{{ message }}" cssClass="message" textWrap="true"/> <Label text="{{ message }}" class="message" textWrap="true"/>
</StackLayout> </StackLayout>
</Page> </Page>

4
apps/template-master-detail/details-view.xml
View File

@ -1,4 +1,4 @@
<StackLayout xmlns="http://www.nativescript.org/tns.xsd"> <StackLayout xmlns="http://www.nativescript.org/tns.xsd">
<Label text="{{ title }}" cssClass="detail-title"/> <Label text="{{ title }}" class="detail-title"/>
<Label text="{{ info }}" cssClass="info" textWrap="true"/> <Label text="{{ info }}" class="info" textWrap="true"/>
</StackLayout> </StackLayout>

4
apps/template-master-detail/main-page.minWH600.xml
View File

@ -2,11 +2,11 @@
xmlns:app="." xmlns:app="."
loaded="pageLoaded"> loaded="pageLoaded">
<GridLayout rows="auto, *" columns="300, *"> <GridLayout rows="auto, *" columns="300, *">
<Label text="Master Details Page" cssClass="title" colSpan="2" /> <Label text="Master Details Page" class="title" colSpan="2" />
<ListView items="{{ items }}" itemTap="listViewItemTap" row="1"> <ListView items="{{ items }}" itemTap="listViewItemTap" row="1">
<ListView.itemTemplate> <ListView.itemTemplate>
<Label text="{{ title }}" cssClass="listItem" /> <Label text="{{ title }}" class="listItem" />
</ListView.itemTemplate> </ListView.itemTemplate>
</ListView> </ListView>

4
apps/template-master-detail/main-page.xml
View File

@ -1,11 +1,11 @@
<Page xmlns="http://www.nativescript.org/tns.xsd" <Page xmlns="http://www.nativescript.org/tns.xsd"
loaded="pageLoaded"> loaded="pageLoaded">
<GridLayout rows="auto, *"> <GridLayout rows="auto, *">
<Label text="Items Page" cssClass="title" /> <Label text="Items Page" class="title" />
<ListView items="{{ items }}" itemTap="listViewItemTap" row="1"> <ListView items="{{ items }}" itemTap="listViewItemTap" row="1">
<ListView.itemTemplate> <ListView.itemTemplate>
<Label text="{{ title }}" cssClass="listItem" /> <Label text="{{ title }}" class="listItem" />
</ListView.itemTemplate> </ListView.itemTemplate>
</ListView> </ListView>
</GridLayout> </GridLayout>

34
apps/template-settings/main-page.xml
View File

@ -1,34 +1,34 @@
<Page xmlns="http://www.nativescript.org/tns.xsd" loaded="pageLoaded"> <Page xmlns="http://www.nativescript.org/tns.xsd" loaded="pageLoaded">
<StackLayout cssClass="content"> <StackLayout class="content">
<!-- Profile sttings --> <!-- Profile sttings -->
<Label cssClass="header" text="Profile"/> <Label class="header" text="Profile"/>
<GridLayout cssClass="field-group" columns="auto, 50, *" rows="auto, auto, auto"> <GridLayout class="field-group" columns="auto, 50, *" rows="auto, auto, auto">
<!-- Name --> <!-- Name -->
<Label cssClass="field" text="Name"/> <Label class="field" text="Name"/>
<Button cssClass="field-dialog-button" text="{{ name }}" tap="{{ promptName }}" col="1" colSpan="2"/> <Button class="field-dialog-button" text="{{ name }}" tap="{{ promptName }}" col="1" colSpan="2"/>
<!-- Height --> <!-- Height -->
<Label cssClass="field" text="Height" row="1"/> <Label class="field" text="Height" row="1"/>
<TextField cssClass="field-value" text="{{ height }}" keyboardType="number" row="1" col="1"/> <TextField class="field-value" text="{{ height }}" keyboardType="number" row="1" col="1"/>
<Label cssClass="field-unit" text="cm" col="2" row="1"/> <Label class="field-unit" text="cm" col="2" row="1"/>
<!-- Weight --> <!-- Weight -->
<Label cssClass="field" text="Weight" row="2"/> <Label class="field" text="Weight" row="2"/>
<TextField cssClass="field-value" text="{{ weight }}" keyboardType="number" row="2" col="1"/> <TextField class="field-value" text="{{ weight }}" keyboardType="number" row="2" col="1"/>
<Label cssClass="field-unit" text="kg" row="2" col="2"/> <Label class="field-unit" text="kg" row="2" col="2"/>
</GridLayout> </GridLayout>
<!-- Notifications settings --> <!-- Notifications settings -->
<Label cssClass="header" text="Notifications"/> <Label class="header" text="Notifications"/>
<GridLayout cssClass="field-group" columns="*, auto" rows="auto, auto, auto"> <GridLayout class="field-group" columns="*, auto" rows="auto, auto, auto">
<!-- Notifications --> <!-- Notifications -->
<Label cssClass="field" text="Vibrate"/> <Label class="field" text="Vibrate"/>
<Switch cssClass="field-value" checked="{{ vibrateEnabled }}" col="1"/> <Switch class="field-value" checked="{{ vibrateEnabled }}" col="1"/>
<!-- Notifications --> <!-- Notifications -->
<Label cssClass="field" text="Sound" row="1"/> <Label class="field" text="Sound" row="1"/>
<Switch cssClass="field-value" checked="{{ soundEnabled }}" row="1" col="1"/> <Switch class="field-value" checked="{{ soundEnabled }}" row="1" col="1"/>
<Slider maxValue="100" value="{{ soundVolume }}" isEnabled="{{ soundEnabled }}" row="2" colSpan="2"/> <Slider maxValue="100" value="{{ soundVolume }}" isEnabled="{{ soundEnabled }}" row="2" colSpan="2"/>
</GridLayout> </GridLayout>
</StackLayout> </StackLayout>

8
apps/template-tab-navigation/main-page.xml
View File

@ -3,16 +3,16 @@
<TabView.items> <TabView.items>
<TabViewItem title="First"> <TabViewItem title="First">
<TabViewItem.view> <TabViewItem.view>
<StackLayout cssClass="tab-content"> <StackLayout class="tab-content">
<Label text="First View" cssClass="title"/> <Label text="First View" class="title"/>
<Label text="This is the content of the first tab." textWrap="true"/> <Label text="This is the content of the first tab." textWrap="true"/>
</StackLayout> </StackLayout>
</TabViewItem.view> </TabViewItem.view>
</TabViewItem> </TabViewItem>
<TabViewItem title="Second"> <TabViewItem title="Second">
<TabViewItem.view> <TabViewItem.view>
<StackLayout cssClass="tab-content"> <StackLayout class="tab-content">
<Label text="Second View" cssClass="title"/> <Label text="Second View" class="title"/>
<Label text="This is the content of the second tab." textWrap="true"/> <Label text="This is the content of the second tab." textWrap="true"/>
</StackLayout> </StackLayout>
</TabViewItem.view> </TabViewItem.view>

2
apps/tests/ui/list-view/list-view-tests.ts
View File

@ -57,7 +57,7 @@ import labelModule = require("ui/label");
// <Page> // <Page>
// {%raw%}<ListView items="{{ myItems }}"> // {%raw%}<ListView items="{{ myItems }}">
// <ListView.itemTemplate> // <ListView.itemTemplate>
// <Label text="{{ title || 'Downloading...' }}" textWrap="true" cssClass="title" /> // <Label text="{{ title || 'Downloading...' }}" textWrap="true" class="title" />
// </ListView.itemTemplate> // </ListView.itemTemplate>
// </ListView>{%endraw%} // </ListView>{%endraw%}
// </Page> // </Page>

2
apps/tests/ui/repeater/repeater-tests.ts
View File

@ -32,7 +32,7 @@ import labelModule = require("ui/label");
// <Page> // <Page>
// {%raw%}<Repeater items="{{ myItems }}"> // {%raw%}<Repeater items="{{ myItems }}">
// <Repeater.itemTemplate> // <Repeater.itemTemplate>
// <Label text="{{ title || 'Downloading...' }}" textWrap="true" cssClass="title" /> // <Label text="{{ title || 'Downloading...' }}" textWrap="true" class="title" />
// </Repeater.itemTemplate> // </Repeater.itemTemplate>
// </Repeater>{%endraw%} // </Repeater>{%endraw%}
// </Page> // </Page>

2
apps/tests/xml-declaration/mymodulewithxml/MyControl.xml
View File

@ -1,4 +1,4 @@
<StackLayout xmlns:customControls="xml-declaration/mymodule" cssClass="MySecondCustomStackLayout"> <StackLayout xmlns:customControls="xml-declaration/mymodule" class="MySecondCustomStackLayout">
<Label id="Label1" text="mymodulewithxml" /> <Label id="Label1" text="mymodulewithxml" />
<Button text="Click!" tap="buttonTap2" /> <Button text="Click!" tap="buttonTap2" />
</StackLayout> </StackLayout>

4
apps/tests/xml-declaration/xml-declaration-tests.ts
View File

@ -201,7 +201,7 @@ export function test_parse_ShouldResolveExportsFromCodeFileForTemplates() {
export function test_parse_ShouldApplyCssFromCssFile() { export function test_parse_ShouldApplyCssFromCssFile() {
var newPage: Page; var newPage: Page;
var pageFactory = function (): Page { var pageFactory = function (): Page {
newPage = <Page>builder.parse("<Page cssFile='~/xml-declaration/custom-css-file.css'><Label cssClass='MyClass' /></Page>"); newPage = <Page>builder.parse("<Page cssFile='~/xml-declaration/custom-css-file.css'><Label class='MyClass' /></Page>");
return newPage; return newPage;
}; };
@ -218,7 +218,7 @@ export function test_parse_ShouldApplyCssFromCssFile() {
export function test_parse_ShouldResolveExportsFromCodeFileAndApplyCssFile() { export function test_parse_ShouldResolveExportsFromCodeFileAndApplyCssFile() {
var newPage: Page; var newPage: Page;
var pageFactory = function (): Page { var pageFactory = function (): Page {
newPage = <Page>builder.parse("<Page codeFile='~/xml-declaration/custom-code-file' cssFile='~/xml-declaration/custom-css-file.css' loaded='loaded'><Label cssClass='MyClass' /></Page>"); newPage = <Page>builder.parse("<Page codeFile='~/xml-declaration/custom-code-file' cssFile='~/xml-declaration/custom-css-file.css' loaded='loaded'><Label class='MyClass' /></Page>");
return newPage; return newPage;
}; };

12
apps/ui-tests-app/image-view/roundimg.xml
View File

@ -1,10 +1,10 @@
<Page> <Page>
<GridLayout rows="*,*,*" columns="*,*"> <GridLayout rows="*,*,*" columns="*,*">
<Image row="0" col="0" src="~/image-view/gravatar.png" cssClass="one"/> <Image row="0" col="0" src="~/image-view/gravatar.png" class="one"/>
<Image row="0" col="1" src="~/image-view/gravatar.png" cssClass="two"/> <Image row="0" col="1" src="~/image-view/gravatar.png" class="two"/>
<Image row="1" col="0" src="~/image-view/gravatar.png" cssClass="three"/> <Image row="1" col="0" src="~/image-view/gravatar.png" class="three"/>
<Image row="1" col="1" src="~/image-view/gravatar.png" cssClass="four"/> <Image row="1" col="1" src="~/image-view/gravatar.png" class="four"/>
<Image row="2" col="0" src="~/image-view/gravatar.png" cssClass="five"/> <Image row="2" col="0" src="~/image-view/gravatar.png" class="five"/>
<Image row="2" col="1" src="~/image-view/gravatar.png" cssClass="six"/> <Image row="2" col="1" src="~/image-view/gravatar.png" class="six"/>
</GridLayout> </GridLayout>
</Page> </Page>

5
ui/core/view-common.ts
View File

@ -14,6 +14,11 @@ import utils = require("utils/utils");
import color = require("color"); import color = require("color");
import animationModule = require("ui/animation"); import animationModule = require("ui/animation");
import observable = require("data/observable"); import observable = require("data/observable");
import {registerSpecialProperty} from "ui/builder/special-properties";
registerSpecialProperty("class", (instance: definition.View, propertyValue: string) => {
instance.cssClass = propertyValue;
});
export function isEventOrGesture(name: string, view: View): boolean { export function isEventOrGesture(name: string, view: View): boolean {
if (types.isString(name)) { if (types.isString(name)) {