Comments (7)
Could you please provide sample code and a screenshot of your observed
behavior?
On Wed, Apr 8, 2015 at 7:47 AM avnerbarr [email protected] wrote:
I right aligned the text component, limited it to 1 line and set a
truncation string. The truncation string doesn't display as expected—
Reply to this email directly or view it on GitHub
#75.
from componentkit.
Sure:
+(instancetype)n {
// the left label should fit and aligned to left side
CKLabelComponent *leftLabel = [CKLabelComponent newWithLabelAttributes:{
.string = @"Left label",
.maximumNumberOfLines = 1,
.color = [UIColor componentsLightGreyColor],
.font = [UIFont componentsTitleFont]
}viewAttributes:{
{@selector(setBackgroundColor:),[UIColor clearColor]}
}];
// the right label should be aligned to the right of the container and truncated
CKLabelComponent *right = [CKLabelComponent newWithLabelAttributes:{
.string = @"This is a really long string that should be truncated",
.truncationString = @"... more",
.maximumNumberOfLines = 1,
.alignment = NSTextAlignmentRight
}viewAttributes:{
{@selector(setBackgroundColor:),[UIColor clearColor]}
}];
CKStackLayoutComponent *stack = [CKStackLayoutComponent newWithView:{
[UIView class],
{
{@selector(setBackgroundColor:),[UIColor clearColor]}
}
} size:{
.minHeight = 44
}style:{
.alignItems = CKStackLayoutAlignItemsStretch,
.direction = CKStackLayoutDirectionHorizontal,
}children:{
{
.component = [CKCenterLayoutComponent newWithCenteringOptions:CKCenterLayoutComponentCenteringY sizingOptions:CKCenterLayoutComponentSizingOptionDefault child:leftLabel size:{.minHeight = 44}],
.flexGrow = YES,
.spacingBefore = 15
},
{
.component = [CKCenterLayoutComponent newWithCenteringOptions:CKCenterLayoutComponentCenteringY sizingOptions:CKCenterLayoutComponentSizingOptionDefault child:right size:{.minHeight = 44}],
.spacingBefore = 20,
.spacingAfter = 15,
.flexShrink = YES
}
}];
return [super newWithComponent:stack];
}
from componentkit.
If i play with the . maximumNumberOfLines the behavior is as you would expect.
from componentkit.
Hmm, yeah, ideally it should consume all available space, not sure yet if this is a bug in text component's truncation or sizing behavior, or if it's an interaction between the stack layout component and the text component.
from componentkit.
Confirmed this is a bug in CKTextKitTailTruncater. I had assumed that right-aligned text was RTL writing direction and as a result the truncation location selected is incorrect. Will fix.
from componentkit.
This should be fixed now, let me know if you continue to have issues.
from componentkit.
@ocrickard
I'm reopening this as the issue is similar.
Setting a max of 1 line breaks with
.lineBreakMode = NSLineBreakByCharWrapping
from componentkit.
Related Issues (20)
- Component not release
- [Documentation] Views path is not render HOT 3
- Delete 'Carthage/Checkouts' directory
- question - docs (docusaurus) repo? HOT 2
- Xcode not building ComponentKit checked out via cocoapods HOT 2
- Docusaurus source code
- question: My component is not getting full width in screen landscape mode. HOT 1
- Not Support Incremental mount
- Build Error with "RenderCoreLayoutCaching" HOT 1
- ComponentKit does not compile with Xcode 12.5 HOT 1
- Compile Error: Block implicitly retains 'self'; explicitly mention 'self' to indicate this is intended behavior HOT 1
- How do I pass multiple arguments
- Unsupported Swift Version: “FBSnapshotTestCase iOS” contains source code developed with Swift 3.x.
- [Question]How to unmount components from HostingView?
- How to make children component height equal to Scroll component's content view height but Scroll component's height HOT 2
- Yoga-internal.h:135:11: error: definition of implicit copy constructor for 'Values<9>' is deprecated
- CKNonNull.h:47:33 No member named 'move' in namespace 'std'; did you mean 'modf'?
- Abandoned?
- ComponentKit/ComponentKit.xcconfig is compiled as source code
- Unable to compile example project
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from componentkit.