🌸 Frontend

[CSS] input focus 효과 제거

기본적으로 input, textarea등에 focus효과가 적용되어있는 경우가 있다. outline, box-shadow를 none처리해주면 해결~ input, input:focus, textarea, textarea:focus { outline: none !important; box-shadow: none !important; }

[Android][Kotlin] ViewBinding 사용하기

기존에 findViewById로 사용하던 것은 속도도 느리고, NullPointException(?맞나) 이 생길 수도 있는 문제가 있었다 그리고 매번 id를 확인해야해서 귀찮았다ㅜㅜ ViewBinding은 레이아웃 생성시 ViewBinding 관련 클래스가 내부에 자동생성되어, 생성한 객체로 해당 레이아웃의 위젯에 접근을 할 수 있다! 설정 build.gradle (app) android { buildFeatures { viewBinding = true } } 이제 ViewBinding을 사용할 수 있게 되었다! 레이아웃 생성시 마다 레이아웃 이름 + Binding 이라는 이름을 갖는 ViewBinding 클래스가 생기는 것임을 기억하자 이제 코드에서 사용해보자 예제 activity_main.xml M..

[Android] 타이틀바 없애기

처음에 프로젝트를 생성하게 되면 실행 시 타이틀바가 기본적으로 붙어있다. 내 스타일은 아니라 없애주겠다! 없어졌다! res/values/styles.xml name = AppTheme으로 설정해주고 parent를 NoActionBar로 해주었다 이제 manifest에서 적용해주면 된다 생성한 Apptheme을 theme으로 적용시켜주었다~!

[Android] 비밀번호 입력창 만들기

웹에서는 input type="password" 로 자주사용했었는데 안드로이드에서 로그인화면은 처음해봐서 EditText 비밀번호 속성도 처음 사용해봤다! 역시나 간단 android:inputType="textPassword" EditText에 위 속성을 추가해주면 된다

[Android] EditText에 border 만들기 (TextView, Button도 가능)

네이버 로그인화면을 보고 로그인창을 만들어보다가 border를 씌우고 싶은데 속성엔 없는 듯 했다 @drawable/box_border.xml drawable에 위와 같은 xml을 생성하고 border를 적용하고싶은 위젯에 background로 넣어주면 된다! 아이디, 비밀번호 EditText에 대해 border를 설정해준 모습이다

[Android] lombok 사용 (getter, setter, constructor 자동생성)

스프링에서 lombok을 썼었는데, 안드로이드를 java로 하게되면서 getter, setter, constructor을 안드로이드 스튜디오에서 Generate를 이용하여 한줄씩 생성하다가 답답해서 lombok있나 찾아보니 있었다! 완전 편함 ^^ File - Setting - Plugins OR Android Studio - Preferences - Plugins 에 들어가서 lombok을 검색하고 설치 build.gradle (app) dependencies { compileOnly 'org.projectlombok:lombok:1.18.16' annotationProcessor 'org.projectlombok:lombok:1.18.16' } 설정 끝! 이제 사용하면 된다 이렇게 사용을 원하는 클래..

[Android][Glide] W/Glide: Load failed for with size

URL에서 이미지를 추출하여 화면에 보여주기 위해 Glide를 사용해보았는데, 이미지가 계속 비어서 나와서 보니까 W/Glide: Load failed for with size [275x275] class com.bumptech.glide.load.engine.GlideException: Failed to load resource 라는 에러가 나고 있었다 load 에서 item에서 getUrl()을 하면 DB에 저장된 이미지 경로가 불러와져야하는데, url을 넣으면 동작하는데 저렇게 하니까 동작하지 않았다. 보니까 itemList에서 내가 item을 생성할 때 imgUrl에 빈 값을 주고 있어서 그랬다..ㅎ 값을 제대로 넣어주니 성공! itemList에 url이 빈값인지 아닌지 확인해보면 해결할 수 있을..

[Android][Java] 일정시간 지난 후 코드 실행

dialog 사용중에, dismiss()를 그냥 사용했더니 창이 너무 빠르게 닫혀서 조금의 딜레이를 주기 위해 아래 코드를 사용하여 약간 지난 후, 닫히도록 했다. Handler mHandler = new Handler(); mHandler.postDelayed(new Runnable() { public void run() { dismiss(); //다른 코드 추가 가능 } }, 200);

[Android] 버튼에 텍스트와 아이콘(이미지) 함께추가

프로젝트 진행 중에 버튼에 텍스트나 이미지만 넣는게 아니라, 텍스트와 이미지 또는 아이콘을 함께 넣고 싶을때가 있었다. 처음엔 텍스트하나와 아이콘 하나를 따로 추가하여 붙여두었다.. 근데 워낙 자주 보이다보니, 더 쉬운 방법이 있을것 같아서 검색해보니 역시 있었다! (바보..) 이렇게 텍스트와 아이콘을 한 버튼에 추가해보자! 정말 간단하다 AppCompatButton 위젯에 속성으로 android:drawableEnd="@drawable/아이콘" 을 추가해주고 넣고싶은 텍스트를 넣어주면, 텍스트와 함께 아이콘이 한 버튼에 들어간다 drawableEnd 대신 Top, Bottom, Start, End, Left, Right 모두 되는 것 같다!

[Vue.js]4.data, click, methods 사용하기

지난 포스팅에 이어서 이번에는 vue에서 data, event 등을 다루는 법을 알아보겠습니다. 1. data 다루기 Home.vue에서 export default 내부에 data() { return }를 추가해주고 return 뒤에 원하는 데이터를 { key : value } 형태로 넣어주면 됩니다. 그리고 그 데이터를 사용하기 위해서는 부분에서 {{ key }} 와 같이 중괄호 두개를 이용하여 추가해주면 얘는 key의 value에 해당하는 부분이 화면에 나타나게 됩니다. About.vue About {{ name }} 2. input html에서 value에 해당하는 것을 vue에서는 v-model로 사용할 수 있습니다. data 부분에 input 데이터를 추가하고 v-model 뒤에 ""을 이용하여..