인프런 커뮤니티 질문&답변
플러터(Flutter) 개발 환경에서 svg 깨짐 현상 해결 방법 문의
작성
·
114
0
플러터(Flutter) 개발 환경에서 svg 깨짐 현상 해결 방법 문의
쌤 안녕하세요~
피그마에서 아이콘 키라인 가이드에 맞춰 아이콘 제작(union > flatten 모두 적용 완료)하여 svg로 아이콘을 전달하였으나, 플러터 개발 환경 > 배포하여 적용해보면 svg 아이콘 깨짐이 발생하는 문제를 겪고 있습니다~
svg export 플러그인, SVG 최적화(SVGOMG) 적용하여 수정했으나, 동일하게 SVG 깨짐 현상이 해결되지 않는데요~
fill rule editer 플러그인은 아직 적용하지 않았으나, 이를 적용하지 않는 것이 문제일까요?
fill rule editer도 다시 적용해 볼 예정입니다만, 해결이 될지 알 수 없어서 문의 드려봅니다! 🥺
실무에 유익한 강의 항상 감사합니다!!
퀴즈
왜 Foundation 라이브러리와 Component 라이브러리를 분리해서 관리하는 경우가 많을까요?
파일 크기를 줄이기 위해
특정 팀이나 플랫폼에 맞는 유연한 관리를 위해
디자이너 개인의 작업 효율성을 높이기 위해
Figma 기능 제한 때문에 필수적이어서
답변 1
0
안녕하세요, askare님
질문 주셔서 감사합니다.
저는 플러터로 svg를 배포 한적이 없어서 딱히 명쾌한 조언을 드리기 어려울 거 같은데요.
플러터 버전 자체의 문제
플러터를 최신 버전으로 업뎃하고 배포시, iOS, 안드로이드 둘 중에 어디서 문제가 생기는지 체크해보시면 좋을 것 같습니다. 그리고 플러터 커뮤니티에 한번 물어보시는 것도 추천드립니다.
svg의 경우 full rule editor도 한번 써보시구요. 저의 경우는 svg export 이것을 사용해서 fill-rule, clip-rule을 제거하는 편입니다.
https://www.figma.com/community/plugin/814345141907543603
개발자에게 테스트 할 경우 하나하나씩 하지 마시고, 여러개 옵션으로 처리한 다양한 군을 보내주고, 무엇이 되는지 물어보는 것도 방법 중 하나입니다.
3. 안될 경우에는 png를 사용하시는 것도 권장드립니다.
감사합니다. 볼드 드림.
도움






볼드쌤 항상 상세한 조언 해주셔서
감사합니다 🙏
다양한 케이스를 적용해보는 꿀팁도 배워갑니다!! 🙏☺