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

Letter spacing in EM units

Browse Source 
Resolves #2528
This commit is contained in:
Rossen Hristov
2016-07-29 14:15:23 +03:00
parent d64cbfaf52
commit d73acb5497
6 changed files with 38 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
apps/app/ui-tests-app/css/letter-spacing.xml
View File

@ -2,12 +2,12 @@
<ScrollView>
<StackLayout>
<WrapLayout>
<Label text="labelLabel" style="letter-spacing: -1;" />
<Label text="labelLabel" style="letter-spacing: -0.1;" />
<Label text="labelLabel" style="letter-spacing: 0;" />
<Label text="labelLabel" style="letter-spacing: 1;" />
<Label text="labelLabel" style="letter-spacing: 0.1;" />
</WrapLayout>
<Label text="labelLabel" style="text-transform: uppercase; text-decoration: underline line-through; letter-spacing: 10;" />
<Label style="text-transform: uppercase; text-decoration: underline line-through; letter-spacing: 10;">
<Label text="labelLabel" style="text-transform: uppercase; text-decoration: underline line-through;letter-spacing: 0.1;" />
<Label style="text-transform: uppercase; text-decoration: underline line-through;letter-spacing: 0.1;">
<Label.formattedText>
<FormattedString>
<FormattedString.spans>
@ -18,13 +18,13 @@
</Label.formattedText>
</Label>
<WrapLayout>
<Button text="buttonButton" style="letter-spacing: -1;" />
<Button text="buttonButton" style="letter-spacing: -0.1;" />
<Button text="buttonButton" style="letter-spacing: 0;" />
<Button text="buttonButton" style="letter-spacing: 1;" />
<Button text="buttonButton" style="letter-spacing: 0.1;" />
</WrapLayout>
<Button text="buttonButton" style="text-transform: uppercase; text-decoration: underline line-through; letter-spacing: 10;" />
<Button text="buttonButton" style="text-transform: uppercase; text-decoration: underline line-through;letter-spacing: 0.1;" />
<!--<android>-->
<Button style="text-transform: uppercase; text-decoration: underline line-through; letter-spacing: 10;">
<Button style="text-transform: uppercase; text-decoration: underline line-through;letter-spacing: 0.1;">
<Button.formattedText>
<FormattedString>
<FormattedString.spans>
@ -36,15 +36,13 @@
</Button>
<!--</android>-->
<WrapLayout>
<ios>
<TextField text="textField" style="letter-spacing: -1;" />
</ios>
<TextField text="textField" style="letter-spacing: -0.1;" />
<TextField text="textField" style="letter-spacing: 0;" />
<TextField text="textField" style="letter-spacing: 1;" />
<TextField text="textField" style="letter-spacing: 0.1;" />
</WrapLayout>
<TextField text="textField" style="text-transform: uppercase; text-decoration: underline line-through; letter-spacing: 10;" />
<TextField text="textField" style="text-transform: uppercase; text-decoration: underline line-through;letter-spacing: 0.1;" />
<!--<android>-->
<TextField style="text-transform: uppercase; text-decoration: underline line-through; letter-spacing: 10;">
<TextField style="text-transform: uppercase; text-decoration: underline line-through;letter-spacing: 0.1;">
<TextField.formattedText>
<FormattedString>
<FormattedString.spans>
@ -56,13 +54,13 @@
</TextField>
<!--</android>-->
<WrapLayout>
<TextView text="textView" style="letter-spacing: -1;" />
<TextView text="textView" style="letter-spacing: -0.1;" />
<TextView text="textView" style="letter-spacing: 0;" />
<TextView text="textView" style="letter-spacing: 1;" />
<TextView text="textView" style="letter-spacing: 0.1;" />
</WrapLayout>
<TextView text="textView" style="text-transform: uppercase; text-decoration: underline line-through; letter-spacing: 10;" />
<TextView text="textView" style="text-transform: uppercase; text-decoration: underline line-through;letter-spacing: 0.1;" />
<!--<android>-->
<TextView style="text-transform: uppercase; text-decoration: underline line-through; letter-spacing: 10;">
<TextView style="text-transform: uppercase; text-decoration: underline line-through;letter-spacing: 0.1;">
<TextView.formattedText>
<FormattedString>
<FormattedString.spans>

4
apps/app/ui-tests-app/mainPage.ts
View File

@ -169,7 +169,7 @@ export class MianPageViewModel extends observable.Observable {
}
public loadExample(exampleName: any) {
console.log("exampleName EXAMLE: " + exampleName);
console.log("exampleName EXAMPLE: " + exampleName);
this.selectExample(exampleName);
}
@ -187,7 +187,7 @@ export class MianPageViewModel extends observable.Observable {
}
private selectExample(selectedExample: any) {
console.log(" EXAMLE: " + selectedExample);
console.log(" EXAMPLE: " + selectedExample);
if (this.examples.has(selectedExample)) {
frame.topmost().navigate("ui-tests-app/" + this.basePath + this.examples.get(selectedExample));

4
tns-core-modules/ui/button/button.ios.ts
View File

@ -263,7 +263,7 @@ export class ButtonStyler implements style.Styler {
if (hasLetterSpacing) {
let attrText = NSMutableAttributedString.alloc().initWithAttributedString(button.ios.attributedTitleForState(UIControlState.UIControlStateNormal));
attrText.addAttributeValueRange(NSKernAttributeName, letterSpacing, { location: 0, length: attrText.length });
attrText.addAttributeValueRange(NSKernAttributeName, letterSpacing * button.ios.font.pointSize, { location: 0, length: attrText.length });
button.ios.setAttributedTitleForState(attrText, UIControlState.UIControlStateNormal);
}
}
@ -286,7 +286,7 @@ export class ButtonStyler implements style.Styler {
}
if (hasLetterSpacing) {
dict.set(NSKernAttributeName, letterSpacing);
dict.set(NSKernAttributeName, letterSpacing * button.ios.font.pointSize);
}
attributes.push({ attrs: dict, range: NSValue.valueWithRange(range) });

15
tns-core-modules/ui/styling/styling.d.ts vendored
View File

@ -207,9 +207,24 @@
*/
opacity: number;
/**
* Gets or sets the text decoration style property. Possible values are contained in the [TextDecoration enumeration](../enums/TextDecoration/README.md).
*/
textDecoration: string;
/**
* Gets or sets the text transform style property. Possible values are contained in the [TextTransform enumeration](../enums/TextTransform/README.md).
*/
textTransform: string;
/**
* Gets or sets the whitespace style property. Possible values are contained in the [WhiteSpace enumeration](../enums/WhiteSpace/README.md).
*/
whiteSpace: string;
/**
* Gets or sets the letter spacing style property. Values are in [EM units](https://en.wikipedia.org/wiki/Em_(typography)). Negative values tighten text.
*/
letterSpacing: number;
//@private

2
tns-core-modules/ui/text-base/text-base-styler.android.ts
View File

@ -115,7 +115,7 @@ export class TextBaseStyler implements style.Styler {
private static setLetterSpacingProperty(view: view.View, newValue: any) {
if(view.android.setLetterSpacing) {
view.android.setLetterSpacing(utils.layout.toDeviceIndependentPixels(newValue));
view.android.setLetterSpacing(newValue);
}
}

4
tns-core-modules/ui/text-base/text-base-styler.ios.ts
View File

@ -155,7 +155,7 @@ export class TextBaseStyler implements style.Styler {
if (hasLetterSpacing) {
let attrText = NSMutableAttributedString.alloc().initWithAttributedString(nativeView.attributedText);
attrText.addAttributeValueRange(NSKernAttributeName, letterSpacing, { location: 0, length: attrText.length });
attrText.addAttributeValueRange(NSKernAttributeName, letterSpacing * (<UIFont>nativeView.font).pointSize, { location: 0, length: attrText.length });
nativeView.attributedText = attrText;
}
}
@ -178,7 +178,7 @@ export class TextBaseStyler implements style.Styler {
}
if (hasLetterSpacing) {
dict.set(NSKernAttributeName, letterSpacing);
dict.set(NSKernAttributeName, letterSpacing * (<UIFont>nativeView.font).pointSize);
}
attributes.push({ attrs: dict, range: NSValue.valueWithRange(range) });