Security News
tea.xyz Spam Plagues npm and RubyGems Package Registries
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
horizantal-marquee-view
Advanced tools
Readme
A react-native horizantal marquee text component.
If you need a vertical marquee text, please use vertical-marquee-view.
Skip this part, go to #Install
I needed a marquee text in one of my recent project and I didn't find a good one online, so I decided to create my own marquee text component.
I intended to make it work well on both iOS and Android, still there remains one thing in iOS which I cannot fix. I found that in iOS, when you use View
component to wrap child components and don't explicitly set the parent View
component width (e.g. use flex
), the parent View
component will have the same width as it's child.
It becomes a problem in this custom component because I use a child View
component to wrap Text
component in order to make the text expand and show in one line. I set the text containner View
component size to be bigger than the Text
so that it will not have multiple lines nor have the overflow text replaced by ellipsis. The default value of text container width is 1000, which is usually larger than the actual label width. This results in the problem mentioned above, the wrapper View
width becomes 1000 also.
<View class="marquee-label">
<View class="marquee-label-text-container">
<Text class="marquee-label-text">{text}</Text>
</View>
</View>
Note:
width
or flex
to layout the view.width
to layout the view. flex
layout is not supported.npm install --save horizantal-marquee-view
import HorizantalMarqueeText from 'horizantal-marquee-view';
<HorizantalMarqueeText
duration={8000}
text={'This is a Marquee Label.'}
textStyle={{ fontSize: 13, color: 'white' }}
/>
or
<HorizantalMarqueeText
speed={250}
textStyle={{ fontSize: 13, color: 'white' }}
>
This is a Marquee Label.
</HorizantalMarqueeText>
children
: string, the text to show in the marquee. Alternative to text
.text
: string, the text to show in the marquee. Alternative to children
.duration
: number(unit: millisecond), the duration for the marquee to run one round. e.g. 6000 (for 6 seconds a round). Alternative to speed
.speed
: number(unit: px/s, px per second), the speed of the marquee. Alternative to duration
.bgViewStyle
: stylesheet object, background view component custom styles.textStyle
: stylesheet object, text component custom styles.textContainerWidth
: number, text container component width. If the text is not shown in one line, increase this value.textContainerHeight
: number, text container component height. If the text is not shown in one line, increase this value.textContainerStyle
: stylesheet object, not recommended to use, text containner component custom style.Version 1.0.0
FAQs
Horizantal Marquee Text for react-native
The npm package horizantal-marquee-view receives a total of 0 weekly downloads. As such, horizantal-marquee-view popularity was classified as not popular.
We found that horizantal-marquee-view demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.