Skip to content

Commit 6f240db

Browse files
KJlmfepcottle
KJlmfe
authored and
pcottle
committed
<Text> module add textDecoration style attributes
1 parent 60b5645 commit 6f240db

10 files changed

Lines changed: 108 additions & 0 deletions

File tree

‎Examples/UIExplorer/TextExample.ios.js‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -185,6 +185,44 @@ exports.examples = [
185185
</View>
186186
);
187187
},
188+
}, {
189+
title: 'Text Decoration',
190+
render: function() {
191+
return (
192+
<View>
193+
<Text style={{textDecorationLine: 'underline', textDecorationStyle: 'solid'}}>
194+
Solid underline
195+
</Text>
196+
<Text style={{textDecorationLine: 'underline', textDecorationStyle: 'double', textDecorationColor: '#ff0000'}}>
197+
Double underline with custom color
198+
</Text>
199+
<Text style={{textDecorationLine: 'underline', textDecorationStyle: 'dashed', textDecorationColor: '#9CDC40'}}>
200+
Dashed underline with custom color
201+
</Text>
202+
<Text style={{textDecorationLine: 'underline', textDecorationStyle: 'dotted', textDecorationColor: 'blue'}}>
203+
Dotted underline with custom color
204+
</Text>
205+
<Text style={{textDecorationLine: 'none'}}>
206+
None textDecoration
207+
</Text>
208+
<Text style={{textDecorationLine: 'line-through', textDecorationStyle: 'solid'}}>
209+
Solid line-through
210+
</Text>
211+
<Text style={{textDecorationLine: 'line-through', textDecorationStyle: 'double', textDecorationColor: '#ff0000'}}>
212+
Double line-through with custom color
213+
</Text>
214+
<Text style={{textDecorationLine: 'line-through', textDecorationStyle: 'dashed', textDecorationColor: '#9CDC40'}}>
215+
Dashed line-through with custom color
216+
</Text>
217+
<Text style={{textDecorationLine: 'line-through', textDecorationStyle: 'dotted', textDecorationColor: 'blue'}}>
218+
Dotted line-through with custom color
219+
</Text>
220+
<Text style={{textDecorationLine: 'underline line-through'}}>
221+
Both underline and line-through
222+
</Text>
223+
</View>
224+
);
225+
},
188226
}, {
189227
title: 'Nested',
190228
description: 'Nested text components will inherit the styles of their ' +

‎Examples/UIExplorer/UIExplorerIntegrationTests/ReferenceImages/Examples-UIExplorer-UIExplorerApp.ios/testTextExampleSnapshot_1@2x.png‎

83.3 KB
Loading

‎Libraries/Text/RCTShadowText.h‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88
*/
99

1010
#import "RCTShadowView.h"
11+
#import "RCTTextDecorationType.h"
1112

1213
extern NSString *const RCTIsHighlightedAttributeName;
1314
extern NSString *const RCTReactTagAttributeName;
@@ -26,6 +27,9 @@ extern NSString *const RCTReactTagAttributeName;
2627
@property (nonatomic, assign) CGSize shadowOffset;
2728
@property (nonatomic, assign) NSTextAlignment textAlign;
2829
@property (nonatomic, assign) NSWritingDirection writingDirection;
30+
@property (nonatomic, strong) UIColor *textDecorationColor;
31+
@property (nonatomic, assign) NSUnderlineStyle textDecorationStyle;
32+
@property (nonatomic, assign) RCTTextDecorationType textDecorationLine;
2933

3034
- (void)recomputeText;
3135

‎Libraries/Text/RCTShadowText.m‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -252,6 +252,22 @@ - (void)_setParagraphStyleOnAttributedString:(NSMutableAttributedString *)attrib
252252
value:paragraphStyle
253253
range:(NSRange){0, attributedString.length}];
254254
}
255+
256+
257+
//underline and line-through
258+
_textDecorationStyle = _textDecorationStyle ? : NSUnderlineStyleSingle;
259+
if(_textDecorationLine == RCTTextDecorationTypeUnderline || _textDecorationLine == RCTTextDecorationTypeUnderlineStrikethrough) {
260+
[self _addAttribute: NSUnderlineStyleAttributeName withValue:[NSNumber numberWithInt:_textDecorationStyle] toAttributedString:attributedString];
261+
}
262+
if(_textDecorationLine == RCTTextDecorationTypeStrikethrough || _textDecorationLine == RCTTextDecorationTypeUnderlineStrikethrough){
263+
[self _addAttribute: NSStrikethroughStyleAttributeName withValue:[NSNumber numberWithInt:_textDecorationStyle] toAttributedString:attributedString];
264+
}
265+
266+
if(_textDecorationColor) {
267+
[self _addAttribute: NSStrikethroughColorAttributeName withValue: _textDecorationColor toAttributedString:attributedString];
268+
[self _addAttribute: NSUnderlineColorAttributeName withValue: _textDecorationColor toAttributedString:attributedString];
269+
}
270+
255271
}
256272

257273
- (void)fillCSSNode:(css_node_t *)node
@@ -298,5 +314,8 @@ - (void)set##setProp:(type)value; \
298314
RCT_TEXT_PROPERTY(ShadowOffset, _shadowOffset, CGSize)
299315
RCT_TEXT_PROPERTY(TextAlign, _textAlign, NSTextAlignment)
300316
RCT_TEXT_PROPERTY(WritingDirection, _writingDirection, NSWritingDirection)
317+
RCT_TEXT_PROPERTY(TextDecorationStyle, _textDecorationStyle, NSUnderlineStyle);
318+
RCT_TEXT_PROPERTY(TextDecorationColor, _textDecorationColor, UIColor *);
319+
RCT_TEXT_PROPERTY(TextDecorationLine, _textDecorationLine, RCTTextDecorationType);
301320

302321
@end

‎Libraries/Text/RCTTextManager.m‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,9 @@ - (RCTShadowView *)shadowView
3535
#pragma mark - Shadow properties
3636

3737
RCT_EXPORT_SHADOW_PROPERTY(writingDirection, NSWritingDirection)
38+
RCT_EXPORT_SHADOW_PROPERTY(textDecorationStyle, NSUnderlineStyle)
39+
RCT_EXPORT_SHADOW_PROPERTY(textDecorationColor, UIColor)
40+
RCT_EXPORT_SHADOW_PROPERTY(textDecorationLine, RCTTextDecorationType)
3841
RCT_EXPORT_SHADOW_PROPERTY(color, UIColor)
3942
RCT_EXPORT_SHADOW_PROPERTY(fontFamily, NSString)
4043
RCT_EXPORT_SHADOW_PROPERTY(fontSize, CGFloat)

‎Libraries/Text/TextStylePropTypes.js‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,13 @@ var TextStylePropTypes = Object.assign(Object.create(ViewStylePropTypes), {
3333
['auto' /*default*/, 'ltr', 'rtl']
3434
),
3535
letterSpacing: ReactPropTypes.number,
36+
textDecorationLine:ReactPropTypes.oneOf(
37+
['none' /*default*/, 'underline', 'line-through', 'underline line-through']
38+
),
39+
textDecorationStyle:ReactPropTypes.oneOf(
40+
['solid' /*default*/, 'double', 'dotted','dashed']
41+
),
42+
textDecorationColor: ReactPropTypes.string,
3643
});
3744

3845
// Text doesn't support padding correctly (#4841912)

‎React/Base/RCTConvert.h‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,10 +12,12 @@
1212

1313
#import "Layout.h"
1414
#import "RCTAnimationType.h"
15+
#import "RCTTextDecorationType.h"
1516
#import "RCTDefines.h"
1617
#import "RCTLog.h"
1718
#import "RCTPointerEvents.h"
1819

20+
1921
/**
2022
* This class provides a collection of conversion functions for mapping
2123
* JSON objects to native types and classes. These are useful when writing
@@ -54,6 +56,7 @@ typedef NSURL RCTFileURL;
5456
+ (NSTimeInterval)NSTimeInterval:(id)json;
5557

5658
+ (NSTextAlignment)NSTextAlignment:(id)json;
59+
+ (NSUnderlineStyle)NSUnderlineStyle:(id)json;
5760
+ (NSWritingDirection)NSWritingDirection:(id)json;
5861
+ (UITextAutocapitalizationType)UITextAutocapitalizationType:(id)json;
5962
+ (UITextFieldViewMode)UITextFieldViewMode:(id)json;
@@ -126,6 +129,7 @@ typedef BOOL css_clip_t;
126129

127130
+ (RCTPointerEvents)RCTPointerEvents:(id)json;
128131
+ (RCTAnimationType)RCTAnimationType:(id)json;
132+
+ (RCTTextDecorationType)RCTTextDecorationType:(id)json;
129133

130134
@end
131135

‎React/Base/RCTConvert.m‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -216,6 +216,20 @@ + (NSDate *)NSDate:(id)json
216216
@"justify": @(NSTextAlignmentJustified),
217217
}), NSTextAlignmentNatural, integerValue)
218218

219+
RCT_ENUM_CONVERTER(NSUnderlineStyle, (@{
220+
@"solid": @(NSUnderlineStyleSingle),
221+
@"double": @(NSUnderlineStyleDouble),
222+
@"dotted": @(NSUnderlinePatternDot | NSUnderlineStyleSingle),
223+
@"dashed": @(NSUnderlinePatternDash | NSUnderlineStyleSingle),
224+
}), NSUnderlineStyleSingle, integerValue)
225+
226+
RCT_ENUM_CONVERTER(RCTTextDecorationType, (@{
227+
@"none": @(RCTTextDecorationTypeNone),
228+
@"underline": @(RCTTextDecorationTypeUnderline),
229+
@"line-through": @(RCTTextDecorationTypeStrikethrough),
230+
@"underline line-through": @(RCTTextDecorationTypeUnderlineStrikethrough),
231+
}), RCTTextDecorationTypeNone, integerValue)
232+
219233
RCT_ENUM_CONVERTER(NSWritingDirection, (@{
220234
@"auto": @(NSWritingDirectionNatural),
221235
@"ltr": @(NSWritingDirectionLeftToRight),

‎React/React.xcodeproj/project.pbxproj‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -241,6 +241,7 @@
241241
83CBBA971A6020BB00E9B192 /* RCTTouchHandler.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTTouchHandler.m; sourceTree = "<group>"; };
242242
83CBBACA1A6023D300E9B192 /* RCTConvert.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = RCTConvert.h; sourceTree = "<group>"; };
243243
83CBBACB1A6023D300E9B192 /* RCTConvert.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTConvert.m; sourceTree = "<group>"; };
244+
E3BBC8EB1ADE6F47001BBD81 /* RCTTextDecorationType.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RCTTextDecorationType.h; sourceTree = "<group>"; };
244245
/* End PBXFileReference section */
245246

246247
/* Begin PBXFrameworksBuildPhase section */
@@ -378,6 +379,7 @@
378379
13B080241A694A8400A75B9A /* RCTWrapperViewController.m */,
379380
13E067531A70F44B002CDEE1 /* UIView+React.h */,
380381
13E067541A70F44B002CDEE1 /* UIView+React.m */,
382+
E3BBC8EB1ADE6F47001BBD81 /* RCTTextDecorationType.h */,
381383
);
382384
path = Views;
383385
sourceTree = "<group>";

‎React/Views/RCTTextDecorationType.h‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
/**
2+
* Copyright (c) 2015-present, Facebook, Inc.
3+
* All rights reserved.
4+
*
5+
* This source code is licensed under the BSD-style license found in the
6+
* LICENSE file in the root directory of this source tree. An additional grant
7+
* of patent rights can be found in the PATENTS file in the same directory.
8+
*/
9+
10+
#import <Foundation/Foundation.h>
11+
12+
typedef NS_ENUM(NSInteger, RCTTextDecorationType) {
13+
RCTTextDecorationTypeNone = 0,
14+
RCTTextDecorationTypeUnderline,
15+
RCTTextDecorationTypeStrikethrough,
16+
RCTTextDecorationTypeUnderlineStrikethrough,
17+
};

0 commit comments

Comments
 (0)