SVG 디자인 에셋을 사용하면서 path가 튀거나, 그라데이션이 적용되지 않는 경우가 종종 있었습니다. 그전에는 그냥 png 파일로 추출해서 사용했는데, 원인을 알아보기 위해 한번 구글링을 해보니 바로 해결책을 찾아 정리를 하겠습니다.

해결

참고 블로그 : Flutter svg 이미지 그라데이션 색이 안나올때

요약하자면, svg를 열었을 때 <defs> 태그를 <svg>태그 바로 아래로 수정하면 된다는 것입니다.

defs 태그는 그라데이션, 마스킹 및 패턴과 같은 SVG 속성을 정의하는데 사용되는 태그

적용 예시

svg 파일을 직접 열어 아래와 같이 <defs> ~ </defs> 를 두번째줄로 옮기니 제대로 표시가 되었습니다. 😆

패키지 설치

$ flutter pub add get

화면을 스택에 추가하면서 이동

Get.to(() => const MainScreen()); Get.toNamed('/MainScreen'));

화면을 스택에서 제거하면서 이동

현재 화면을 제거하고 새로운 화면으로 이동 Get.off(() => const MainScreen()); Get.offNamed("/MainScreen")

모든 화면을 제거하면서 이동 Get.offAll(MainScreen());

특정 조건을 만족하는 화면까지 스택에서 화면을 제거하면서 이동 Get.until((route) => Get.currentRoute == '/home'); //홈 화면까지 제거하면서 이동 Get.offUntil(GetPageRoute(page: () => const MainScreen()), ModalRoute.withName('/profile'));

메인화면까지 이동하고 profile 화면 표시 Get.offNamedUntil('/MainScreen', ModalRoute.withName('/profile'));

기타

다이얼로그가 닫힐때까지 화면 이동 Get.until((route) => !Get.isDialogOpen!); Get.offNamedUntil("/home", (route) => Get.isOverlaysClosed);

사용 예제

void navigateScreen() {
    Get.to(() => const MainScreen());
    Get.toNamed("/MainScreen");

    Get.off(() => const MainScreen());
        Get.offAll(MainScreen());
    Get.offNamed("/MainScreen")
    Get.until((route) => Get.currentRoute == '/home');
        Get.offUntil(
      GetPageRoute(page: () => const MainScreen()), // 조건: 메인 화면까지 이동
      ModalRoute.withName('/profile'), // 메인화면까지 이동 후 profile 화면 표시
    );
    Get.offNamedUntil('/MainScreen', ModalRoute.withName('/profile'));


    // 기타
    // 다이얼로그가 닫힐때까지 화면 이동
    Get.until((route) => !Get.isDialogOpen!); 
    Get.offNamedUntil("/home", (route) => Get.isOverlaysClosed); // overlay = snackbar, dialog, bottomsheet
  }

DraggableScrollableSheet를 Stack으로 감싸서 사용할 수 있다.

구글 지도 예시

👉 구현

DraggableScrollableSheet을 사용해 실제로 구현한 화면이다.

initialChlidSize - 처음 높이를 설정. 부모 위젯의 비율로 조정된다. minChildSize, maxChildSize - 콘텐츠가 표시되는 영역을 설정.

사용자가 드래그 하는 만큼 콘텐츠를 표시할 수 있고 ScrollController를 사용하면 더 디테일하게 설정할 수 있다.

사용자가 드래그 중 손을 뗄 때 위젯이 특정 크기로 스냅되도록 하려면 snap을 true로 설정한다.

DefaultLayout(
      title: "DraggableScrollableSheetScreen",
      body: Stack(
        children: [
          Container(
            color: Colors.white,
            child: Text("지도"),
          ),
          DraggableScrollableSheet(
            // 화면 비율로 높이 조정
            initialChildSize: 0.4,
            minChildSize: 0.4,
            maxChildSize: 1.0,
            builder: (BuildContext context, ScrollController scrollController) {
              return SingleChildScrollView(
                controller: scrollController,
                child: Container(
                    height: 1500,
                    decoration: BoxDecoration(
                        borderRadius: BorderRadius.only(
                            topLeft: Radius.circular(20),
                            topRight: Radius.circular(20)),
                        color: Colors.purpleAccent),
                    child: _buildCustomBottomSheet()),
              );
            },
          )
        ],
      ),
    );

Reference

https://api.flutter.dev/flutter/widgets/DraggableScrollableSheet-class.html https://stackoverflow.com/questions/52403709/partially-viewable-bottom-sheet-flutter

개인정보처리방침

개인정보의 수집 당사는 개인정보를 수집하지 않습니다.

개인정보의 이용 당사는 개인정보를 수집하지 않으므로 이용에 관련된 내용은 없습니다.

개인정보의 제공 당사는 개인정보를 수집하지 않으므로 제공에 관련된 내용은 없습니다.

개인정보의 보유 및 이용기간 당사는 개인정보를 수집하지 않으므로 보유 및 이용 기간에 관련된 내용은 없습니다.

개인정보의 파기 당사는 개인정보를 수집하지 않으므로 파기에 관련된 내용은 없습니다.

개인정보 관리책임자 당사는 개인정보를 수집하지 않으므로 개인정보 관리책임자에 대한 내용은 없습니다.

개인정보 보호책임자 당사는 개인정보를 수집하지 않으므로 개인정보 보호책임자에 대한 내용은 없습니다.

개인정보 보호 관련 민원서비스 당사는 개인정보를 수집하지 않으므로 개인정보 보호 관련 민원서비스에 대한 내용은 없습니다.

개인정보 처리방침 변경 본 방침은 법령, 정책 및 보안기술의 변경에 따라 변경될 수 있습니다. 변경 시 이 페이지를 통해 사전 공지할 것입니다.

contact ✉️ dpsk2880@gmail.com

뭔가 방법이 없을까하고 구글링을 하던 중에 ssh key를 사용해 한 개의 컴퓨터에서 여러개의 깃허브 계정을 사용할 수 있다고해서 차근차근 정리를 해본다

👉 기본 원리는 한 개의 컴퓨터에서 두 개의 ssh key를 생성하고 하나는 개인 계정, 하나는 회사 계정에 연결해 사용하는 것이다

Set Up

두 개의 깃허브 계정을 준비한다 (🦋:개인계정, 🐝: 회사계정)

무슨생각으로 계정 이름을 지었는지 알 수 없지만... 정말 헷갈리게 대충 지었다
깃허브에 연동된 이메일은 Setting → Emails 에서 확인 할 수 있다

우선 ssh key는 ~/.ssh 폴더안에서 생성되어야해서 cd ~/.ssh 명령어를 통해 이동해준다

SSH Key 생성하기

다음 명령어를 통해 ssh key를 생성한다 계정이름은 구분하기위한 용도라서 아무렇게나 설정해도 된다

ssh-keygen -t rsa -C "계정@gmail.com" -f "계정이름"

## example
🦋 ssh-keygen -t rsa -C "lena@gmail.com" -f "id_rsa_personal"
🐝 ssh-keygen -t rsa -C "lena@회사계정.com" -f "id_rsa_corp"

명령어를 입력하면 아래와 같은 문구가 나오면서 비밀번호를 설정할 수 있지만 그냥 빈칸으로 엔터를 쳐서 넘어간다

Enter passphrase (empty for no passphrase):
Enter same passphrase again:

완료되면 다음과 같은 문구가 나온다

ls ~/.ssh 명령어를 통해 생성되었는지 파악할 수 있다 생성되었다면 계정이름으로 된 파일과 계정이름.pub 파일을 각각 확인 할 수 있다

SSH Key 등록하기

위에서 생성한 계정이름을 통해 SSH Key를 등록해준다

ssh-add 계정이름

🦋 ssh-add id_rsa_personal
🐝 ssh-add id_rsa_corp

이렇게 하면 ssh key가 등록된다

SSH Key 확인하기

cat ~/.ssh/{계정이름}.pub

SSH Key 적용하기

Github → Settings → SSH and GPG keys → New SSH key 에 이전단계에서 확인한 SSH key를 넣어준다

~/.ssh.config 파일 설정

(없다면 vi편집기를 통해 생성하기!)

다음내용을 config 에 적어준다

## 개인계정 
Host personal-github.com
HostName github.com
User git
IdentityFile ~/.ssh/id_rsa_personal

## 회사계정
Host corp-github.com
HostName github.com
User git
IdentityFile ~/.ssh/id_rsa_corp

여기서 Host 뒤에 적은 personal-github.com 여기가 중요하다!!

깃허브에 등록되었는지 확인하기

다음 명령어를 입력하면 연결을 계속 할거냐고 물어보는데 yes 입력하면 성공적으로 등록된다

ssh -T corp-github.com
ssh -T personal-github.com

repository 클론

이제 클론할 때 SSH를 이용해 클론하게 될텐데 ... !

git@github.com:yena-lena/shop_app.git 에서 앞부분 github.com을 config 에서 설정한 이름으로 변경한다

git clone git@personal-github.com:yena-lena/shop_app.git

을 통해 연결해주면 계정관리를 편하게 할 수 있다!!!!

드디어 해결

먼저 LFS를 사용하기 위해 다음 명령어로 설치를 합니다.

brew install git-lfs

이후 LFS를 사용하고자 하는 로컬 저장소로 이동하고 다음 명령어를 입력합니다.

git lfs install

Git LFS로 관리할 파일경로를 입력해 지정하면 됩니다.

git lfs track "파일경로"

만약 이미 커밋한 경우, git rm --cache 파일경로 명령어를 입력한 뒤 git lfs track 파일경로 명령어를 통해 관리해주면 됩니다.

또한 lfs로 트래킹하는 파일에 대한 정보는 .gitattributes을 통해서 관리가 되어 이 변경사항을 꼭 add해주어야한다.

git add .gitattributes

이후, 커밋 후 푸쉬하면 지정된 대용량 파일은 LFS를 통해 관리가 됩니다.

배경

동생이 재택근무하는데 여러 키워드를 검색하며 광고 대상이 네이버 파워링크 상 순위를 조사하고, 체크하는 단순노가다를 붙잡고 짜증을 내는걸 보고 제작하게 되었습니다.

요구사항

1. 복수개의 키워드는 엑셀파일로 입력
2. 파워링크 검색 결과를 저장하고 타겟 브랜드의 순위를 출력
3. PC/mobile 두가지 버전 필요
4. 순위 결과는 엑셀파일로 저장

구조

1. 키워드 목록을 불러옴
2. 파워링크 도메인에 특정 키워드를 검색하는 base url 생성
3. 검색 결과 중 광고 제목( class = "lnk_tit" ) 만 크롤링해서 리스트로 저장 -> beautiful soup 사용
4. 제목 리스트에서 타겟 브랜드가 몇 위에 노출되었는지 출력
5. csv 파일로 저장

예시

타겟 브랜드가 디디치킨인 경우, 치킨을 검색했을 때 검색결과에서 나온 순위(현재 예시에서는 3위)를 출력하고 다음 키워드를 탐색하며 반복한다.

코드첨부

import csv
import requests
from urllib.request import urlopen
from urllib.parse import quote_plus
from bs4 import BeautifulSoup
import re
import pandas as pd

#cp949 에러 발생시 csv파일 인코딩을 메모장에서 ANSI로 변경
## file_name : 파워링크 검색 키워드 목록
## find : 탐색할 업체
file_name = "keyword.csv"
find = "치킨"

f = open(file_name,'r', encoding="utf-8")
df = pd.read_csv(f)
keywords = df['이름']

## PC 버전 크롤링
data = []

url = 'https://ad.search.naver.com/search.naver?where=ad&x=0&y=0&query='

for keyword in keywords:
    base_url = url+quote_plus(keyword)

    response = requests.get(base_url)

    if response.status_code == 200:
      soup = BeautifulSoup(response.content, 'html.parser')

    items = soup.find_all(attrs={'class':'lnk_tit'})

    rank = 1
    temp = 0

    for item in items[:10]:#10위까지만 탐색
      serial = item.get_text()
      #print(serial[:10])
      if "네네치킨" in serial:
          temp = rank
      rank = rank+1

    data.append([keyword,temp])


# 결과 저장
result = pd.DataFrame(data, columns=['Name','Rank'])
print(result)
result.to_csv('result.csv', encoding='euc-kr')

Warning이라 실행되길래 그냥 무시하고 넘길까 했는데 가끔씩 본 에러문구여서 제대로 알고 넘어가기로 했다.

원인

해당 오류는 데이터프레임의 열의 값이 이미 메모리에 존재하고 있는데, 그 메모리에 직접적으로 접근하여 수정하는 경우 발생하는 경고문구이다.

result_df = df[df["option"].isin(select_list)]
result_df["rank"][0] = match_num 

이런 식으로 result_df와 df가 연결되어있어 열의 값을 직접 변경하는 경우 에러가 발생한다.

해결책

copy()를 통해 result_df와 df를 분리해 해결했다.

result_df = df[df["option"].isin(select_list)].copy()