joekndy / marqueetext Goto Github PK
View Code? Open in Web Editor NEWMarquee or "scrolling text" effect in SwiftUI
Marquee or "scrolling text" effect in SwiftUI
The tarket version for WatchOS is set to v6, but the code requires version 7.
Steps to reproduce:
I am pushing text from an iOS device to the watch and using MarqueeText to display on the watch which helps put more text on a small screen. When the text updates from an observed object @ObservedObject the text will update but not the view containers which results in the new text using the previous or original animation movements. I think this has to do with the internal logic of how SwiftUI makes updates and it appears it is only updating the text in the view thinking that it is only the text that has changed. This might just be on the watch where perhaps SwiftUI is optimized to make minimal changes.
Is there a way to force a full refresh of all the child views in MarqueeText? I tried making MarqueeText Equatable but that does not appear to force a full refresh.
Any thoughts on how to force a full refresh of the MarqueeText View?
Thanks for this project. I'm using the following snippet:
let text = "Dies ist ein recht langer Text, der müsste eigentlich mal zu scrollen beginnen…"
MarqueeText(text: text, font: UIFont.systemFont(ofSize: 20), leftFade: 16, rightFade: 16, startDelay: 3)
.background(.pink)
.border(.black)
.padding()
Which leads to the following video (please ignore the stuff below the marquee):
Fixing this is simple by removing the mask offsets, but then it's visible that the mask is rendered unconditionally. Is it possible to render the mask only when the text is actually scrolling and not during the delay?
Hi there,
Thanks for this handy library!
I'm not sure what i'm doing wrong, but it appears that I'm getting duplicate entries (on the horizontal), per the below.
If you look close, both the track title and album titles start to show again on the right, if they are not long enough to scroll kick off the scrolling.
I've bascially got the text items in a VStack, inside an HStack to the right of the album artwork.
VStack(alignment: .leading) {
MarqueeText(
text: item.track.name,
font: UIFont.preferredFont(forTextStyle: .headline),
leftFade: 16,
rightFade: 16,
startDelay: 3
)
MarqueeText(
text: item.track.album?.name ?? "",
font: UIFont.preferredFont(forTextStyle: .caption1),
leftFade: 16,
rightFade: 16,
startDelay: 3
)
}
Any thoughts?
SwiftUI Text view support inline display of SF Symbols
when I tried in MarqueeText it didn't seem to work
I want to understand why string height is being considered in the xOffset of Texts?
It might be helpful to explain the solution in Readme for fellow developers.
Thank you for sharing this code, Joe.
I'm just seeing an issue, I wanted to know if you see the same or know what could be going on.
This works great:
HStack {
Spacer()
MarqueeText(
text: "A subtitle that is way too long, but it scrolls homie. A subtitle that is way too long, but it scrolls homie",
font: UIFont.preferredFont(forTextStyle: .subheadline),
leftFade: 16,
rightFade: 16,
startDelay: 3
)
Spacer()
}
This breaks:
NavigationView {
HStack {
Spacer()
MarqueeText(
text: "A subtitle that is way too long, but it scrolls homie. A subtitle that is way too long, but it scrolls homie",
font: UIFont.preferredFont(forTextStyle: .subheadline),
leftFade: 16,
rightFade: 16,
startDelay: 3
)
Spacer()
}
}
When it's inside a NavigationView the text moves all the way from the top edge of the screen down to the position it should be, at the same time it's scrolling left.
I have a widget with this library, but the example doesn't seem to scroll... is this a limitation of WidgetKit?
Starting in spring 2024 Apple will require Privacy manifest files to be included in XCFrameworks, Swift packages, and or framework bundles.
Depending on a UIFont
makes this a bit inconvenient to use, it would be better to pick up the SwiftUI .font
modifiers.
To measure the size of the resulting text, MeasureSize can be used. Then, it's just a matter of adding a hidden overlay to do the size computation:
.overlay {
Text(self.text)
.lineLimit(1)
.fixedSize()
.CC_measureSize(perform: { size in
self.textSize = size
})
.hidden()
}
If you want to give this a try, here's a file with these modifications integrated.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.