쪼렙 as! 풀스택

[React Native] 처음 설치할때 각종 오류 해결.

코코앱 — Wed, 20 Oct 2021 15:06:03 +0900

안드로이드 빌드 에러.

mac 에 설치되어있는 자바 버전이 너무 높아서 빌드 오류가 난다.

gradlewrapper.properties 에서 그래들 버전을 올리라는 해결방법도 있었으나, 잘 안되고 실패.

사용하고 있는 자바 버전을 변경해서 해결하였다.

https://llighter.github.io/install-java-on-mac/

Swift 5.4 - 키보드 올라올라올 때 애니메이션 정확히 동일한 curve 알기.

코코앱 — Tue, 1 Jun 2021 21:03:52 +0900

NotificationCenter.default.publisher(for: UIResponder.keyboardWillHideNotification)
    .receive(on: RunLoop.main)
    .sink { [weak self] (notification) in
                
        let curve = notification.userInfo?[UIResponder.keyboardAnimationCurveUserInfoKey] as! UInt
        let duration = notification.userInfo?[UIResponder.keyboardAnimationDurationUserInfoKey] as! Double;

        let curveOpt = UIView.AnimationOptions(rawValue: curve << 16)
            
        UIView.animate(withDuration: duration, delay: 0, options: [curveOpt]) {
            self?.constBottom.constant = 0;
            self!.layoutIfNeeded()
        }
    }

Node.js - spawn - ffmpeg 이용하여, facebook, Instagram LIVE 에 영상 송출하기.

코코앱 — Sun, 31 Jan 2021 14:32:15 +0900

function start(streamUrl, streamKey, opt, SOURCE_URL) {
    if (!opt) {
        opt = '-ar 44100 -vcodec libx264 -b:v 3200k -f flv';  //ffmpeg 송출 option
    }

    const target = streamUrl + (streamUrl.charAt(streamUrl.length - 1) === '/' ? '' : '/') + streamKey;

    const argStr = `-re -i ${SOURCE_URL} ${opt} ${target}`
    const command = `ffmpeg ${argStr}`
    const args = argStr.split(' ');

	console.log(command)
    // spawn 을 시작한다.
    const proc = spawn('ffmpeg', args);

    // 이벤트 핸들링
    proc.on('error', function (error) {
        console.error(error)
    })

    proc.stdout.on('data', function (data) {
    	console.log(data)
    })

    proc.stderr.on('data', function (data) {
		console.log(data)
    })

    proc.on('exit', function (code) {
    	console.log('Exit code : ', code)
    })
}

React에서 Socket 연결을 Custom Hook 이용하여 구성해 보았다.

코코앱 — Sun, 31 Jan 2021 13:45:45 +0900

웹 소켓을 이용하여 채팅 메시지를 보여줘야 할 필요가 있었는데,

React - Hooks 를 주로 사용하는 프로젝트에 붙여야 했다.

그냥 웹소켓에 연결하고 응답받는거야 그리 큰 어려움은 아니겠지만,

뭔 상태하나가 바뀌건, props 가 바뀌건, 시도때도없이 render 를 호출하는 리액트 hooks 에,

웹소켓 연결을 붙이는것은 고민이 좀 많이 되었었다.

그래서 이래저래 많은 시도를 해보았는데,

커스텀 훅을 만드들어서 해결한 방법이 가장 깔끔했고, 리액트 훅에 잘 어울린것 같다.

use-my-socket.ts

export enum MySocketState {
  onNewChatReceived = 'onNewMessageReceived',
  onConnectionFailed = 'onConnectionFaield',
  onConnectionOpened = 'onConnectionOpened'
}


export const useMySocket = (
    onConnectionStateChanged: (state: MySocketState) => void
  ) => {

  //응답받은 문자열을 넘겨줄 state
  const [responseMessage, setResponseMessage] = useState('')

  // 연결을 시작한다.
  useEffect(() => {
    connectStart()
  }, [])

  
  //소켓 연결 시작.
  const connectStart = () => {
    const ws = new WebSocket(MY_HOST_NAME);
    ws.onmessage = (e) => {
      e.preventDefault();      
      const data = e.data;
      
      setResponseMessage(data)
      onConnectionStateChanged(MySocketState.onNewMessageReceived)
    }

    ws.onopen = () => {
      onConnectionStateChanged(MySocketState.onConnectionOpened)
    };

    ws.onclose = () => {
      onConnectionStateChanged(MySocketState.onConnectionFailed)
    };
  }

  return {responseMessage: responseMessage}
}

useMySocket 을 사용할 React Component

import { useMySocket, MySocketState } from './use-my-socket';

export default MyComponent = () => {
  
  const { responseMessage } = useMySocket((state) => {
    if (state === MySocketState.onNewMessageReceived ) {
      console.log('onNewMessageReceived');
    }
    else if (state === MySocketState.onConnectionFailed ) {
      console.error('onConnectionFailed');
    }
    else if (state === MySocketState.onConnectionOpened) {
      console.log('onConnectionOpened');
    }
  });

  return (
    <div>{responseMessage}</div>
  )
}

Android Webview 에서 javascript window 객체에 접근해, 네이티브 기능 실행하기

코코앱 — Sun, 31 Jan 2021 10:46:48 +0900

안드로이드 웹뷰에서,

window 객체를 통해

안드로이드 네이티브 함수를 호출 할 수 있다.

MainActivity.kt ...

class MainActivity : AppCompatActivity() {
  override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)
    val webView = findViewById<WebView>(R.id.webview)

    val settings = webView.settings;
    settings.javaScriptEnabled = true
    settings.javaScriptCanOpenWindowsAutomatically = true
    settings.allowContentAccess = true
    settings.mixedContentMode = WebSettings.MIXED_CONTENT_ALWAYS_ALLOW
    webView.loadUrl("https://MY_URL.COM")
    webView.addJavascriptInterface(MyInterface(this), "myAndroidInterface")
  }
  
  
  class MyInterface(private val mContext: Context) {
    @JavascriptInterface
    fun toast() {
      Toast.makeText( mContext, "토ㅅ트 띄워라!!!", Toast.LENGTH_LONG).show()
    }
  }
}

이렇게 하면, window.myAndroidInterface 를 이용해서, 안드로이드 네이티브 기능을 호출 할 수 있다.

아래는 웹 HTML 에서, 안드로이드의 Native Toast 를 호출하는 예시이다.

<!DOCTYPE html> 
<html> 
  <head> 
    <meta charset="UTF-8"> 
    <title>웹뷰</title> 
    <script> 
      function clickButton() { window.myAndroidInterface.toast(); } 
    </script> 
  </head> 
  <body> 
    <h1>웹뷰</h1> 
    <button onclick="clickButton()" >클릭 버튼!!!!!</button> 
  </body> 
</html>

iOS 는 window 객체에 직접 접근할 수 있는 방법은 모르겟고 (없는거 같다.)

MessageHandler 를 이용해야 하는것 같다.

그에 대한 내용은 아래에 정리해뒀다.

iOS 하이브리드앱, Javascript 로 웹뷰에 메세지 보내기 (네이티브 코드 사용할 수 있도록)

PHP 코드 수정이 바로 적용되지 않을 때, opcache disable 시키기.

코코앱 — Thu, 19 Nov 2020 16:24:42 +0900

방법 1 - php.ini

opcache.enable=0

방법 2 - .htaccess

php_flag opcache.enable Off

방법 3 - php 파일에

<?php
	ini_set('opcache.enable', '0');
?>

React - localhost 에서 cookie samesite 이슈 해결하기.

코코앱 — Sun, 6 Sep 2020 22:51:43 +0900

크롬의 새로운 쿠키 정책에 의해서,

개발 환경인 localhost에서 쿠키를 이용한 로그인 유지기능에 문제가 생겼다.

** cookie 에 SameSite 옵션을 'None'으로 해야만 CORS 가 가능하다.

** SameSite 옵션이 'None' 인 경우, Secure 옵션은 true 여야만한다. -> 사이트가 https 여야만 한다.

이 두가지 전제때문에, 몇군데 손을 봐야만 했다.

1. PHP >= 7.3 에서 SameSite 옵션 설정하기.

$expire = time() + 3600		
setcookie('cookieName', 'cookieValue', ['expires'=>$expire, 'httponly'=>true, 'samesite'=>'None', 'secure'=>true, 'path'=>'/']);

2. 서버 헤더 설정

Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: Content-Type, x-requested-with, origin ...
Access-Control-Allow-Origin: https://localhost:3000

3. axios - option 의 withCredentials = true, crossDomain = true 로 준다.

const opt = { method:'get', url: URL, crossDomain: true, withCredentials: true }

4. 프로젝트 루트에 .env 파일을 추가

HTTPS=true

이렇게 하면 https://localhost:3000 으로 접속할 수 있다.

크롬에서 인증서가 유효하지 않다고 경고가 뜨는것은 살포시 무시해준다.

물론, Production 환경에서는, allow origin 도 사용하지 않고, samesite 도 설정해주지 않으면 보안에 도움이 될것이다.

[개발후기] 매일감사 매일기도 - iOS, Android 앱

코코앱 — Sun, 6 Sep 2020 17:26:54 +0900

AWS - ElasticBeanstalk, RDS, S3, CloudFront

PHP - CodeIgniter

Android - JAVA, iOS - Swift

참여율 100% - 혼자 다 만들었다.

매일매일 '감사일기'를 기록하거나, 기도 제목을 적을 수 있는 크리스찬을 위한 앱.

외주로 만든것도 아니고, 어떤 수익을 바란것도 아니고, 그냥 '재능기부' 식으로, 혼자 운영하고 있는 앱 서비스.

1. 편지지(배경화면)에 작성한 글을 어떻게 제공할 것인가? 이미지? 텍스트?

사용자가 편지지에 글을 쓰고, 글의 위치를 마음대로 조절할 수 있게 개발을 하였다. 그러다보니, 완성된 편지를 어느 환경에서 보아도 똑같이 볼 수 있게 하려면, 이미지로 서비스해야겠다고 생각하고, 사용자가 글 작성을 완료하면, 화면 자체를 저장하여 '이미지'로 만들고, 그 이미지를 파일서버로 업로드했었다.

문제점 - 글을 수정할 수 가 없다. 이미지 이기때문에... ㅡ,.ㅡ; 글을 수정하려면 삭제하고 다시 작성해야하는 불편함이 있었다. 그래서 텍스트 방식으로 완전히 변경하였다.

이후에는 사용자 환경마다 다 다르게 보이는 단점이 생겼다. 특히나 화면의 넓이가 다 다르기 때문에, 줄바꿈이 글쓴이의 의도대로 보여지지 않을 가능성이 매우 많았다. 또한 화면 크기가 다 다르기 때문에, 글씨크기를 화면 크기에따라 동적으로 조정해줄 필요가 있었다. 그래서 폰트의 크기를 px 로 저장하지 않고, 화면크기의 비율로 (1미만의 float값)으로 저장했다. 그리고 사용자 기기의 크기마다 동적으로 폰트 크기를 계산해서 보여줬더니, 거의 대부분 사용자가 작성한것과 비스무리(?) 하게 보일 수 있었다. 이미지로 처리할때처럼 완벽하게 동일하게 보일 수는 없겠지만, 어차피 글쓴이 본인에게는 본인 의도대로 보일것이고, 글을 수정할 수 있는 기능을 제공하는게 더 중요하기 때문에 이정도로 만족하기로 했다.

2. 편지지에 직접 쓰는 느낌을 최대한 살리기 위한 노력들 (터치 이벤트)

편지지를 선택하고, 그 편지지에 글을 직접 작성할 수 있고, 글의 위치를 마음대로 조정할 수 있게 만들었다.

편집기에 공을 들였다.

문제는 글의 위치를 마음대로 조정할 수 있어야 하다보니, 레이아웃이 굉장히 많이 겹친 상태에서, 터치이벤트를 아주 상세하게 다뤄야만 했다. 글을 작성하고 있는 상태에서의 터치는 커서를 움직여야 했고, 편집중이 아닐때는, 글의 위치를 조정할 수 있어야 했고, 심지어 아이폰에서는 키보드를 밀어내릴 수도 있어야 했다.

글의 위치를 조정하기부터 쉽지 않았다. 사용자가 편리하고 자연스럽게 움직일 수 있게 하려면, 터치 이벤트가 발생하는 곳과 현재 위치등의 상관관계의 계산을 상세하게 해주어야만 했다.

글 편집중 상태가 아닐 때는 터치할 때, 이게 글의 위치를 변경하기 위함인지, 글을 작성하기 위한 터치인지도 구분해줘야 했는데, 'Tap Event' 와 'Pan Event' 를 구분해줘야 했다.

또다른 이슈는 글 편집중에 커서를 움직일 때는 레이아웃의 순서 때문에 Pan Event 가 먼저 발생해버렸는데 이때는 'onInterceptTouchEvent'를 통해서 터치이벤트를 중간에서 인터셉트하여 처리해야하기도 했다.

3. 사용자가 많아지면서 생긴 에로사항들 - 기기 블랙리스트, 단어 필터, 글 쓰기 제한 기능등의 도입

그냥 혼자 만들어본 프로젝트라서, 이렇게 많은 사람들이 사용하게 될줄 몰랐는데, 가입자가 3,000명쯤 되기 시작할 때부터는, 이상한 글들이 올라오기 시작했다. 주기적으로 자기한테 돈좀 보내달라고 파밍글을 올리는 사람이 생겼다.

처음에는 그 계정만 차단했다. 그랬더니 다른 계정으로 계속 가입해오면서 글을 올리기 시작했다. 계정 블록으로는 안되는구나.

그래서 다음부터는 기기 자체에 블랙리스트 기능을 만들었다. Android 와, iOS 에 있는 uuid 를 이용해서, 특정 기기들은 아예 로그인이 안되게 막아버렸다.

그랬더니, 이제는 한두달에 한번씩 기기를 변경해서 오드라... 크아... 정말 끈질긴 사람... 그래서, 단어필터를 이용해서 특정단어 (xx 은행, 뱅크, 등등) 이 포함된 글은 그냥 '비공개'처리를 해버렸다. 그 후로는 그 글이 사라졌다.

이후에 생긴 문제는, 남들이 공감할 수 없는 내용으로 도배를 하는 사람이 생겨났다. 서비스를 운영하는 입장에서는 이게 정말 안좋다. 그래서 고육지책으로 '전체공개'하는 글은 하루에 한번만 작성할 수 있도록 변경했다. 원래 이 앱 자체가 '전체공개'가 주된 목적이라기 보다, 감사글을 저장/보관하는 목적이 크기때문에, 많은 회원들에게 더 좋은 환경을 제공할 수 있게 되었다.

4. 아직도 혼자 운영중

홍보조차 단한번 한적 없지만, 그래도 나름 7,000명이 넘는 가입자가 사용하면서, 좋은 평점을 많이 받은, 나름 애착이 있는 앱 서비스 이다.

나에게 수익이 되기는 커녕, 서버비가 나가고, 유지보수도 해야하는 사비들여서 운영하고 있는 서비스 이지만, 가끔 이렇게 좋은 리뷰가 달릴때마다 보람이 생긴다.

매우 좋은 평점을 유지하고 있다.

심지어 불교인도 사용하는 앱ㅋㅋ

2020년 9월 10일 기준

[개발후기] Valuetong.com 부동산 실거래 정보 서비스

코코앱 — Sat, 5 Sep 2020 15:20:30 +0900

AWS - S3, ElasticBeanstalk, CloudFront, RDS

PHP - CodeIgniter,

React, Axios, Mobx, Material-UI, SASS,

Hybrid APP - iOS (Swift) , Android (Kotlin)

참여율 100% - 역시 모두 혼자 다 만들었다. ㅋ

감정평가사 3분과 함께 만든 프로젝트.

의욕적으로 개발하셨지만, 감정평가사라는 직업이 굉장히 바쁜 직업인지라 관리를 안하신다. 그냥 죽은 프로젝트가 된 듯하다.

이 프로젝트를 하면서, 새로 알게 된것들이 정말 많다. 좌표계라던지, 지오메트리 타입과 SpartialIndex, 우리나라 주소체계, 개별공시지가 등등;

부동산에대한 전반적인 지식뿐 아니라, 맵과 관련된 개발이슈들을 정말 많이 공부하게 되었다.

밸류통 사용 예

0. React (Web) + Hybrid App

웹 + 모바일 웹 + 안드로이드 + 아이폰 앱을 모두 개발하기 원하셨다.

나 혼자 개발을 해야 했고, 개발 시간과 관리의 용이성을 위해, 반응형 웹을 만들고, 웹뷰로 패키징하여 하이브리드 앱으로 출시하기로 했다.

웹은 React 로 개발하였다.

1. 서비스의 목표

국가에서 제공하는 '부동산 실거래' 데이터를 활용하여, 지도에 보기좋게 표시하는것이다.

사실, 토지/단독/상업 부동산 거래의 실거래 데이터에는 정확한 '지번주소'가 공개되어있지 않고, '어떤 지역의 어느정도 규모의 거래' 정도만 공개되어있는 것인데, 이것을 '감정평가사'분들의 특별한 노하우(?)로 지번주소를 매칭하여 특정하고 보여주는 것이 핵심이였다.

실거래 이외에, 개별공시지가, 토지정보, 건축물대장등을 볼 수 있다.

2. 데이터 확보. 이 많은 데이터를 어떻게 할 것인가?

가장 먼저 할것은 우리나라의 모든 주소별로 토지 정보를 필요로 했다.

개별공시지가 데이터 + 토지별 폴리곤 데이터 + 좌표 를 확보했다.

data.go.kr 공공데이터 포털에서 확보하였는데, 토지정보라는 것이 생각보다 실시간으로 업데이트가 필요한 경우가 많이 있었다. 그래서 관리자페이지에서 '토지특성' 과 '건물정보'를 공공데이터 포털을 통해 자동으로 업데이트 하는 기능을 만들어 주었다.

토지특성정보와 건물정보를 자동으로 최신데이터로 업데이트할 수 있게 만들어 두었다.

'토지특성'과 '건물정보'는 필수로 모든 데이터를 확보해야만 했는데, '건축물대장' 등의 데이터는 고민이 많이 되었다. 실제로 얼마나 사용될것인가, 하는 활용도에 비해, 과도하게 많은 데이터를 확보해 두어야 하고, 주기적으로 업데이트 해야하는 관리를 해야 하기 때문이였다. 그래서 '건축물 대장'과 토지별 과거 '공시지가' 데이터는 사용자가 보려고 할 때, 실시간으로 공공데이터에서 불러와서 보여주는 방식을 선택하였다.

과거공시지가/건축물대장 등은 서버에 저장하지 않고, 공공데이터포털에서 실시간 로드한다

3. 부동산 실거래의 지번주소 매칭 구현.

정부에서 공개하는 토지/ 단독다가구 / 상업업무의 실거래 정보는 정확한 지번주소가 없다. 그래서 특정한 조건으로 매칭하여 지번주소를 유추할 수 있는데, 관리자페이지에서 프로그래밍으로 자동으로 지번주소를 유추하여 매칭할 수 있는 기능을 만들어 주었다. '특정 조건'들을 모두 만족하면 가장 정확하게 유추가 되고, 몇가지 조건을 해제하고 조합하여, '정확도의 단계화'를 구현해 주었다. '특정 조건'은 민감한 내용으로 공개할 수 없다.

자동으로 주소를 유추하는 기능을 구현해 주었으나, 이것 역시 한계가 있어, 주소 유추가 되지 않는 데이터들이 많이 남는다. 이때는 감정평가사의 내부 데이터를 이용해 수기로 입력하는 수밖에 없어, 유추가 되지 않은 데이터의 목록을 엑셀로 다운로드 받고, 수기로 주소PNU 를 입력하고 업로드할 수 있는 기능을 만들어 주었다. 여기서는 https://github.com/PHPOffice 를 사용하였다.

4. Kakao MAP

카카오맵을 사용하였는데, 맵에 관련된 거의 모든 기능들을 다 가져다 활용했다.

로드뷰 처리, 커스텀마커-레이어, 각종 이벤트, 확대축소, 이동, 폴리곤 표시, 지오코더(addressSearch, coord2Address) 등, 모두 구현해야만 했다. 덕분에 맵 처리에 관해 공부를 정말 많이 하였다.

5. Hybrid App

안드로이드와 아이폰 앱개발도 해야 했는데, 나는 원래 네이티브로만 개발을 해왔기 때문에, 단순 웹뷰를 쓰는거는 많이 해봤어도, 이렇게 웹뷰로만 이루어진 하이브리드 앱은 처음 해보았다. 네이티브 개발도 맨날 해왔는데, 하이브리드앱쯤이야, 뭐 어려울게 있겠어? 라고 생각했었는데, 생각보다 까다롭거나 생각해야할 일들이 발생했다. 그냥 모바일 웹브라우저에서는 자바스크립트가 잘 실행되는데, 웹뷰에서는 자바스크립트 실행이 마음대로 되지 않았다. Alert 같은 이벤트가 발생하면, 델리게이트나 리스너를 통해서 직접 구현해주어야 했고, 특히 카카오톡 로그인 같은 경우에, 모바일 웹브라우저에서는 자동으로 '카카오톡 앱'을 실행시켜서 로그인을 할 수 있는데, 웹뷰에서는 '카카오톡 앱'이 실행되지 않는다!! 카카오 개발자 포럼에서 봤더니, 웹뷰에서는 그냥 웹 카카오 로그인을 지원할 뿐, 카카오톡 모바일앱이 자동으로 실행되지는 않는단다. 이런사정을 사용자들이 알아줄리가 있나. 그래서 웹뷰에서 카카오톡 로그인을 누르면, '카카오톡 앱'을 실행시켜서 로그인을 할 수 있는 방법을 고민해야 했고, 웹뷰의 shouldOverrideUrlLoading 을 오버라이드해서 네이티브 앱을 띄워주는 방법으로 해결하게 되었다. 이와 관련된 자세한 내용은 'https://kokohapps.tistory.com/entry/안드로이드-하이브리드앱-웹뷰-WebView-에서-카카오톡-로그인-앱-사용하기' 에 자세히 작성해 두었다. 코드는 남기지 않았지만, 아이폰에서도 동일한 방법을 사용했다.

6. 그밖에

정말 많은 공부를 해야했다. 일단 좌표계에대해 공부를 해야만 했고, 공공데이터에서 얻어온 좌표를 올바로 사용하기 위해서는 좌표계를 변환해야만 했다. www.osgeo.kr/17 참고했고, github.com/proj4php/proj4php 이걸로 변환하였다. 또 데이터를 저장하기 위해 SpartialIndex 라던지, Geometry 타입이라던지, 이런것도 처음 써봤다;;;; 도통 이런걸 쓸일이 없었는데...

결국, 앱 개발을 완료하고 나는 개발비용을 다 받았으나... 막상 이 프로젝트를 시작하신분들은, 본인의 주 업무들이 너무 바쁘셔서, 그냥 손 놓으셨다;;;; 내가 테스트삼아 넣었던 데이터 이외에 아무런 업데이트를 안하고 계신다. 이게 서비스란게, 개발만 하면 알아서 돌아가는것이 아니라, 계속해서 관리를 해주어야 한다는것을 입이 닳도록 말씀드렸건만, 이제는 아얘 잊고 계신거 같다.

그래서 지금은 내가 테스트때 넣은 중랑구 일대에만 데이터가 있다;;;;

정말 많은 공부를 했던 프로젝트이고, 그만큼 재밌기도 했다.

접속주소

https://valuetong.com

안드로이드 앱 다운로드

play.google.com/store/apps/details?id=com.valuetong.andapp.valuetong

밸류통 - 부동산 가치소통의 장! - Google Play 앱

밸류통 - 전국 토지, 건물, 빌딩, 아파트, 빌라 등 실거래 데이터 조회 및 분석을 통한 부동산 투자정보 길잡이 밸류통입니다. 문의사항은 valuetong@gmil.com

play.google.com

iOS - Storyboard 에서 UILabel 에 Padding 설정하기

코코앱 — Thu, 19 Mar 2020 11:51:29 +0900

출처 : https://stackoverflow.com/a/33244365

스토리보드에서 바로 값을 설정할 수 있어서 매우 편리하다.

//
//  PaddedLabel.swift
//  TrainCentric
//
//  Created by Arsonik
//  https://stackoverflow.com/a/33244365/337934
//

import UIKit

@IBDesignable
class PaddedLabel: UILabel {

    @IBInspectable var inset:CGSize = CGSize(width: 0, height: 0)

    var padding: UIEdgeInsets {
        var hasText:Bool = false
        if let t = self.text?.count, t > 0 {
            hasText = true
        }
        else if let t = attributedText?.length, t > 0 {
            hasText = true
        }

        return hasText ? UIEdgeInsets(top: inset.height, left: inset.width, bottom: inset.height, right: inset.width) : UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
    }

    override func drawText(in rect: CGRect) {
        super.drawText(in: rect.inset(by: padding))
    }

    override var intrinsicContentSize: CGSize {
        let superContentSize = super.intrinsicContentSize
        let p = padding
        let width = superContentSize.width + p.left + p.right
        let heigth = superContentSize.height + p.top + p.bottom
        return CGSize(width: width, height: heigth)
    }

    override func sizeThatFits(_ size: CGSize) -> CGSize {
        let superSizeThatFits = super.sizeThatFits(size)
        let p = padding
        let width = superSizeThatFits.width + p.left + p.right
        let heigth = superSizeThatFits.height + p.top + p.bottom
        return CGSize(width: width, height: heigth)
    }
}