본문 바로가기

스틱코드100

[Kotlin][Android] 수평 측정기 앱을 만들어 보자 안녕하세요 '~' / 오늘은 스틱 코드와 안드로이드 센서를 이용해서 아래와 같은 순서로 수평 측정기를 만들어 보겠습니다. 1. 수평을 측정하는 화면 구현 2. 수평을 측정하는 기능 구현 3. 테스트 스틱코드? https://stickode.com/mainlogin.html STICKODE stickode.com 1. 수평 측정 화면 구현 ▶ 수평 측정을 시각적으로 보여주는 뷰를 만들기 위해 TiltView.kt라는 코틀린 클래스 파일을 만들어줍니다. # TiltView.kt 전체 코드 package com.example.accelerometersensor import android.content.Context import android.graphics.Canvas import android.graphic.. 2021. 7. 16.
[Kotlin][Android] 구글맵 빠르게 적용하기 안녕하세요. 이번에는 코틀린을 통하여 구글 지도를 제 앱에 띄우는 것을 해보도록 하겠습니다. 이를 구현하기 위해서는 구글 맵 API를 사용해야 하는데요. API(Application Programing Interface)가 무엇인지 간단하게 설명드리면, 응용 프로그램(일반적인 앱을 생각하시면 됩니다.)에서 다른 프로그램(운영체제, 프로그램 언어, 서버, 데이터 베이스 등등)에서 제공하는 기능을 제어할 수 있게 만든 인터페이스(매개체) 입니다. 구글 맵 API를 사용하려면 구글 플레이 서비스 SDK를 설치해야 합니다. 상단 메뉴의 [Tools] - [SDK Manager]를 클릭해 줍시다. 클릭하게 되면 아래 사진처럼 SDK 설정 화면이 나옵니다. [SDK Tools] 탭을 클릭하면 안드로이드 개발에 필요.. 2021. 7. 12.
[JavaScript] 빠르게 To Do 리스트 만들기 이번 예제에서는 자바스크립트만을 이용해 To Do 리스트를 만들어보겠습니다. 따라하기 전, 스틱코드에 올라온 자바스크립트로 투두리스트 만들기 코드를 즐겨찾기 해주세요 먼저 html 코드를 작성해봅시다. html 파일에서 스틱코드 호출태그인 ToDoList-HTML을 입력하면 자바스크립트로 투두리스트를 만들기 위해 필요한 html 코드가 자동완성됩니다. 일단 HTML 코드에서는 수정없이, JS 파일과 CSS 파일을 작성해보겠습니다. 스틱코드로 만든 투두리스트 추가 모두 삭제 다음으로 필요한 css 코드를 작성해줍니다. 이전과 마찬가지로 css 파일에서 스틱코드 호출태그인 ToDoList-CSS를 입력하면 자바스크립트로 투두리스트 만들기 - css 코드가 자동완성됩니다. 이제 호출태그로 완성된 코드 중 수정.. 2021. 7. 8.
[HTML / CSS] 반응형 구현해보기 스틱코드라는 플러그인을 이용해 반응형 예제를 구현해봅시다. 스틱 코드에 등록된 코드를 간편하게 불러와서 사용해봅시다. * 반응형 웹 예제 https://stickode.com/detail.html?no=2195 스틱코드 stickode.com ==================================================================== 반응형 웹 디자인이란? 하나의 웹사이트에서 PC, 스마트폰, 태블릿 PC 등 접속하는 디스플레이의 종류에 따라 화면의 크기가 자동으로 변하도록 만든 웹페이지 접근 기법을 말합니다. 반응형을 하면 무엇이 좋은가? 웹사이트를 PC용과 모바일용으로 각각 별개로 제작하지 않고, 하나의 공용 웹사이트를 만들어 다양한 디바이스에 대응할 수 있습니다. PC.. 2021. 7. 5.
[Java][Android] 동적 UI 생성 안녕하세요! 오늘은 스틱코드를 이용하여 동적 UI 생성을 해보도록 하겠습니다. 1. 동적 레이아웃과 클래스 생성 먼저 동적으로 생성될 레이아웃을 생성 합니다. sub.xml 위 레이아웃을 객체화 시킬 클래스를 생성합니다. Sub.java developer.android.com/reference/android/view/LayoutInflater LayoutInflater | Android 개발자 | Android Developers developer.android.com 2. 동적UI 적용 'activity_main.xml' 에 이벤트를 발생시킬 버튼과 동적으로 레이아웃이 생성될 구역을 만들어줍니다. activity_main.xml 다음으로 'MainActivity'에 버튼, 동적 레이아웃을 담을 컨테이너.. 2021. 7. 4.
[Kotlin][Android] QR 코드 리더기 안녕하세요. ZXing 라이브러리를 이용하여 QR 코드 리더기 앱을 만들어 보도록 하겠습니다. 개발 순서는 다음과 같습니다. 1. 라이브러리 추가 및 권한 설정 2. 화면 만들기(XML) 3. 코드 작성하기(QrCodeActivity.kt) 1. 라이브러리 추가 및 권한 설정 1-1) ZXing 라이브러리 github.com/journeyapps/zxing-android-embedded journeyapps/zxing-android-embedded Barcode scanner library for Android, based on the ZXing decoder - journeyapps/zxing-android-embedded github.com Build, Gradle에 Zxing 라이브러리 추가하기 S.. 2021. 7. 1.
[Kotlin][Android] OCR 기능을 만들어보자 안녕하세요~ 오늘은 코틀린을 사용하여 OCR(Optical character recognition) 기능을 구현해 보겠습니다. OCR는 인간이 종이 위에 써 놓은 글씨를 인지하여 텍스트 데이터로 바꿔주는 기능을 말해요. 이 포스팅에서는 스틱코드를 사용하여 글자가 들어 있는 이미지에서 글자를 인식하는 간단한 앱을 만들어보겠습니다. 해당 포스팅에 사용된 스틱코드 stickode.com/detail.html?no=2177 스틱코드 stickode.com # 환경 세팅 1. 라이브러리 추가 ▶ 해당 기능을 사용하기 위해서는 tess-two라는 모듈이 필요합니다. 위 그림처럼 build.gaddle(moudle) 파일을 열어서 맨 아래 한 줄을 추가하고 동기화시켜줍니다. 최신 버전은 여기서 확인하실 수 있습니다... 2021. 6. 24.
[Kotlin][Android] Data Bindng을 이용한 계산기 어플 만들기 안녕하세요. 예전에 자바를 이용해서 계산기를 만들어 봤는데요. 이번에는 코틀린으로 구현해보도록 하겠습니다. 이번 예제에서는 특히 화면에 View들이 많이 들어가는데요. 일일이 findVidwID를 통해서 각 View를 접근하기에는 너무 힘들고 귀찮은 작업입니다. 그래서 이번에는 Data Binding을 사용해서 현재 Activity와 연결되어 있는 .xml 파일의 View에 접근해보도록 하겠습니다. Data Binding은 Jetpack의 구성요소 중 하나입니다. 제트팩은 2018년 구글 IO 행사에서 발표된 안드로이드 앱 개발 패키지 묶음입니다. 데이터 바인딩은 이름 그대로 액티비티나 프래그먼트의 데이터를 화면에 출력하는 부분을 도와주는 AAC 기법입니다. Data Binding이 무엇인지 안드로이드 .. 2021. 6. 20.
[JavaScript] 입력 값 복사해서 다른 입력창에 값 넣어주기 자바스크립트을 활용하여 입력값을 복사해서 다른 입력창에 값을 넣어주는 예제를 만들어보겠습니다. 먼저, 스틱코드에 올라온 '입력된 값 복사해서 붙여넣기' 코드를 즐겨찾기 추가해주세요. 먼저 html 코드를 작성해봅시다. html 파일에서 스틱코드 호출태그인 copyInputValue-HTML을 입력하면 이번 예제의 html 코드가 자동완성됩니다. 일단 HTML 코드에서는 수정없이, JS 파일과 CSS 파일을 작성해보겠습니다. 주문고객 정보 보내시는 분: 연락처: 주소: 배송지 정보 주문 고객 정보와 동일 받으시는 분: 연락처: 주소: 다음으로 필요한 css 코드를 작성해줍니다. 이전과 마찬가지로 css 파일에서 스틱코드 호출태그인 copyInputValue-CSS를 입력하면 이번 예제의 css 코드 샘플이.. 2021. 6. 14.

티스토리툴바