만든이유

앱스토어의 업데이트쪽을 보면 업데이트된 내역을 2줄까지만 표시하고
그 이상은 더보기 버튼을 클릭해서 볼 수 있게 되어있다.

이게 좋은 UI 인것 같아서 만들어 보기로 했다.

깃허브 링크

라이브러리 형태로 만들었기 때문에 깃허브에서 SPM으로 사용하면 된다.

사용방법

import SwiftUI
import ExpandableText

struct ExpandableText_Test: View {
let sampleText: String = "Do you think you're living an ordinary life? You are so mistaken it's difficult to even explain. The mere fact that you exist makes you extraordinary. The odds of you existing are less than winning the lottery, but here you are. Are you going to let this extraordinary opportunity pass?"
    
    var body: some View {
        ExpandableText(text: sampleText)
            .font(.body)//optional
            .foregroundColor(.primary)//optional
            .lineLimit(3)//optional
            .expandButton(TextSet(text: "more", font: .body, color: .blue))//optional
            .collapseButton(TextSet(text: "less", font: .body, color: .blue))//optional
            .expandAnimation(.easeOut)//optional
            .padding(.horizontal, 24)//optional
    }
}

사용방법은 let으로 만들었지만 @State를 사용해서 변하는 값으로 넣어도 된다

추가 이야기

이 라이브러리를 만들면서 어려웠던 점은
더보기 왼쪽의 그라데이션 이였다.

사소한 디테일 이지만 이게 없다면 매우 이상하다고 생각했다.

만약 이걸 그냥 흰색으로 덮는다면 흰색이 아닌 다른색 배경에서 이상하게 보이게 된다.
그래서 mask기능을 이용해서 텍스트 자체를 자르는 방식으로 했다.

mask기능은 다음에 글을 작성할 것 같다.