Closed andreykats closed 4 years ago
Hi there,
Feel free to contribute to this project by creating a PR, if you see there is any issue. I'm currently focused on QDesigner Beta (https://Q-Mobile.IT/Q-Designer).
Best, Karol
Great Work
Can I know how to add action on cell tap?
NavigationLink seem not to be doing good, when the view loads cells all of them turn into blue. ` VStack{
if networkManager.loading{
Text("Loading movies")
}else{
QGrid(networkManager.movies.results, columns: 3){movie in
NavigationLink(destination: MovieDetails(movie: movie)){
QGridCell(movie: movie)
}
}
}
}`
some problem like you, how to fix it
I resolved this issue in my project. It has nothing to do with QGrid. Your QGridCell should look like this:
struct GridCellButton: View {
var imageName: String
var text: String
var body: some View {
VStack(alignment: .center) {
Image(self.imageName)
.renderingMode(Image.TemplateRenderingMode?.init(Image.TemplateRenderingMode.original))
.resizable()
.scaledToFit()
.shadow(color: .primary, radius: 5)
Text(self.text).lineLimit(1)
}
}
}
struct QGridCell: View {
var book: Book
var body: some View {
NavigationLink(destination: DetailView()) {
GridCellButton(imageName: book.imageName, text: book.bookName)
}
Please note setting a rendering mode for your image:
.renderingMode(Image.TemplateRenderingMode?.init(Image.TemplateRenderingMode.original))
By default, "linking" controls are blue (e.g. text below the image), so the image is also blue. When you specify the rendering mode, image will be rendered well.
As pointed above, the root cause of this issue lies in the default renderingMode
of an image.
You should specify the following for your images within the cell:
.renderingMode(.original)
Here is a working sample of the GridCell
from QGridTestApp
:
struct GridCell: View {
var person: Person
var body: some View {
NavigationLink(destination: DetailView()) {
VStack() {
Image(person.imageName)
.renderingMode(.original)
.resizable()
.scaledToFit()
.clipShape(Circle())
.shadow(color: .primary, radius: 5)
.padding([.horizontal, .top], 7)
Text(person.firstName).lineLimit(1)
Text(person.lastName).lineLimit(1)
}
.font(.headline).foregroundColor(.black)
}
}
}
Can you please elaborate on the usage of NavigationLink with QGrid?
NavigationLink does not seem to be working here.