javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-08-17 21:01:34 +08:00
Code Issues Packages Projects Releases Wiki Activity

Scrollable content on session page

Browse Source
This commit is contained in:
vakrilov
2015-03-21 16:17:26 +02:00
parent ba67154129
commit 60b2b08c99
2 changed files with 70 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
apps/TelerikNEXT/app.css
View File

@ -1,15 +1,7 @@
Label, Button {
Label, Button, Image {
margin: 0 5;
}
Image {
margin: 5;
}
.header-image {
margin: 0;
}
.page-title {
font-size: 18;
color: #fac950;
@ -47,11 +39,11 @@ Image {
.section-header {
color: #A17201;
margin: 5 5 0 10;
margin: 5 5 0 5;
}
.horizontalLine {
.horizontal-line {
height: 1;
background-color: #FAC950;
margin: 5 5 0 10;
margin: 5 5 0 5;
}

37
apps/TelerikNEXT/session-page.xml
View File

@ -2,14 +2,11 @@
xmlns:tsb="app/TelerikNEXT/TelerikUI/side-bar"
navigatedTo="pageNavigatedTo">
<GridLayout rows="auto, auto, auto, auto, auto, auto, auto, auto, auto, auto, auto" columns="70, *">
<GridLayout rows="auto, *">
<!-- HEADER -->
<Image colSpan="2" src="~/app/images/background.jpg" stretch="aspectFill" cssClass="header-image"/>
<StackLayout col="1" >
<Label text="{{ title }}" textWrap="true" cssClass="page-title" margin="15 5 0 5"/>
<GridLayout columns="70, *" style="background-image: url('~/app/images/background.jpg')">
<StackLayout col="1" margin="15 5">
<Label text="{{ title }}" textWrap="true" cssClass="page-title"/>
<Label cssClass="info-orange">
<Label.formattedText>
<FormattedString>
@ -22,24 +19,26 @@
</Label.formattedText>
</Label>
</StackLayout>
<Image tap="toggleFavorite" cssClass="favourite-image"
src="{{ favorite ? '~/app/images/fav.png' : '~/app/images/addfav.png' }}"
visibility="{{ canBeFavorited ? 'visible' : 'collapsed' }}" />
</GridLayout>
<!-- Scrollable content -->
<ScrollView row="1">
<GridLayout rows="auto, auto, auto, auto, auto, auto, auto, auto, auto, auto, auto" columns="70, *" >
<!-- Description -->
<Label cssClass="info" textWrap="true" row="1" col="1" margin="10 5 5 10"
<Label cssClass="info" textWrap="true" col="1" margin="10 5 5 5"
text="Here is the description. Here is the description. Here is the description. Here is the description. Here is the description. Here is the description. Here is the description. " />
<!-- Line -->
<StackLayout cssClass="horizontalLine" row="2" col="1"/>
<StackLayout cssClass="horizontal-line" row="1" col="1"/>
<!-- Speakers -->
<Label text="Speakers" cssClass="section-header" row="3" col="1" />
<ListView items="{{ speakers }}" row="4" colSpan="2" height="{{ speakers.length * 76 }}" selectedBackgroundColor="#fac950" separatorColor="#FFFFFF">
<Label text="Speakers" cssClass="section-header" row="2" col="1" />
<ListView items="{{ speakers }}" row="3" colSpan="2" height="{{ speakers.length * 76 }}" selectedBackgroundColor="#fac950" separatorColor="#FFFFFF">
<ListView.itemTemplate>
<GridLayout columns="70, *" cssClass="list-view-row">
<GridLayout columns="65, *" cssClass="list-view-row">
<Image src="{{ picture }}" verticalAlignment="top"/>
<StackLayout col="1">
@ -69,14 +68,16 @@
</ListView>
<!-- Line -->
<StackLayout cssClass="horizontalLine" row="5" col="1"/>
<StackLayout cssClass="horizontal-line" row="4" col="1"/>
<!-- More -->
<Label text="More" cssClass="section-header" row="6" col="1"/>
<Label text="More" cssClass="section-header" row="5" col="1"/>
<Label text="LEAVE FEEDBACK" row="7" col="1"/>
<Label text="LEAVE FEEDBACK" row="6" col="1"/>
<Label text="WATCH VIDEOS" row="8" col="1"/>
<Label text="WATCH VIDEOS" row="7" col="1"/>
</GridLayout>
</ScrollView>
</GridLayout>
</Page>