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

Add line-height test page (#4638)

Browse Source 
* Add lineHeight property to text-base.d.ts

* Add line-height test page
This commit is contained in:
Vasil Chimev
2017-08-02 09:30:29 +03:00
committed by GitHub
parent 0f14101238
commit c26f1c916a
4 changed files with 47 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
apps/app/ui-tests-app/css/line-height.ts Normal file
View File

@ -0,0 +1,20 @@
import { EventData, TextBase } from "tns-core-modules/ui/text-base";
const values = [3, 7, 13];
export function buttonTap(args: EventData) {
let page = (<TextBase>args.object).page;
let lbl = <TextBase>page.getViewById("label");
let btn = <TextBase>page.getViewById("button");
let tv = <TextBase>page.getViewById("textView");
let ft = <TextBase>page.getViewById("formattedText");
let index = values.indexOf(lbl.lineHeight);
let newIndex = (index + 1) % values.length;
let newValue = values[newIndex];
lbl.lineHeight = newValue;
btn.lineHeight = newValue;
tv.lineHeight = newValue;
ft.lineHeight = newValue;
}

21
apps/app/ui-tests-app/css/line-height.xml Normal file
View File

@ -0,0 +1,21 @@
<Page>
<StackLayout>
<Button automationText="Change" text="Change" tap="buttonTap" />
<Label automationText="label" id="label" textWrap="true" style="text-decoration: underline; text-transform: capitalize; letter-spacing: 0.1; line-height: 7;"
text="The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog." />
<Button automationText="button" id="button" ios:textWrap="true" style="text-decoration: underline; text-transform: capitalize; letter-spacing: 0.1; line-height: 7;"
text="The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog." />
<TextView automationText="textView" id="textView" style="text-decoration: underline; text-transform: capitalize; letter-spacing: 0.1; line-height: 7;"
text="The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog." />
<Label automationText="formattedText" id="formattedText" textWrap="true" style="text-decoration: underline; text-transform: capitalize; letter-spacing: 0.1; line-height: 7;">
<Label.formattedText>
<FormattedString>
<FormattedString.spans>
<Span text="The quick brown fox jumps over the lazy dog." style="font-weight: bold; color: green;" />
<Span text="The quick brown fox jumps over the lazy dog." style="font-style: italic; color: blue;" />
</FormattedString.spans>
</FormattedString>
</Label.formattedText>
</Label>
</StackLayout>
</Page>

2
apps/app/ui-tests-app/css/main-page.ts
View File

@ -14,6 +14,7 @@ export function loadExamples() {
examples.set("formatted", "css/decoration-transform-formattedtext"); examples.set("formatted", "css/decoration-transform-formattedtext");
examples.set("radius", "css/radius"); examples.set("radius", "css/radius");
examples.set("spacing", "css/letter-spacing"); examples.set("spacing", "css/letter-spacing");
examples.set("line-height", "css/line-height");
examples.set("decoration", "css/text-decoration"); examples.set("decoration", "css/text-decoration");
examples.set("transform", "css/text-transform"); examples.set("transform", "css/text-transform");
examples.set("whitespace", "css/white-space"); examples.set("whitespace", "css/white-space");
@ -39,6 +40,5 @@ export function loadExamples() {
examples.set("styled-formatted-text", "css/styled-formatted-text"); examples.set("styled-formatted-text", "css/styled-formatted-text");
examples.set("non-uniform-radius", "css/non-uniform-radius"); examples.set("non-uniform-radius", "css/non-uniform-radius");
examples.set("missing-background-image", "css/missing-background-image"); examples.set("missing-background-image", "css/missing-background-image");
return examples; return examples;
} }

5
tns-core-modules/ui/text-base/text-base.d.ts vendored
View File

@ -29,6 +29,11 @@ export class TextBase extends View implements AddChildFromBuilder {
*/ */
letterSpacing: number; letterSpacing: number;
/**
* Gets or sets lineHeight style property.
*/
lineHeight: number;
/** /**
* Gets or sets text-alignment style property. * Gets or sets text-alignment style property.
*/ */