본문 바로가기
Project/SwiftUI 블록와이드

[SwiftUI Project] LazyVStack 하이라이트 색 설정하기

by iOS_woo 2022. 10. 2.

리스트처럼 하이라이트 적용

List에서는 row를 터치했을 때 자동으로 하이라이트됩니다.

하지만 LazyVStack으로 리스트를 작성했을 때는 하이라이트가 적용되지  않습니다.

Navigation Link의 리스트를 LazyVStack으로 생성했을 때 버튼 스타일을 지정해주면 하이라이트를 만들 수가 있습니다. 

 

아래는 이번에 적용하며 참고한 글에서 가져온 코드입니다.

import SwiftUI

struct ContentView: View {
    
    private var names = ["Andy", "Steve", "Kevin", "David"]
    
    var body: some View {
        NavigationView {
            ScrollView {
                LazyVStack(alignment: .leading) {
                    ForEach(names.sorted(), id: \.self) { name in
                        NavigationLink(
                            destination: Text("Destination"),
                            label: {
                                HStack {
                                    Text(name)
                                        .foregroundColor(.primary)
                                        .padding()
                                    Spacer()
                                }
                            })
                            .buttonStyle(ListSelectionStyle()) // 버튼 스타일을 바꿔줍니다!
                    }
                }
            }
            .navigationTitle("Names")
        }
    }
}

struct ListSelectionStyle: ButtonStyle { // 버튼 스타일 지정
    func makeBody(configuration: Self.Configuration) -> some View {
        configuration.label
            .background(configuration.isPressed ? Color.gray : Color.clear)
    }
}

 

 

 

코드 출처: 

 

SwiftUI — Customise LazyVStack items highlighted colour

How to change the highlighted colour of the items in LazyVStack in a NavigationLink or a Button

medium.com

 

댓글