[아두이노중급.002]터치스크린으로 아두이노 LED/센서 제어하기
[아두이노중급.002]터치스크린으로 아두이노 LED/센서 제어하기 Nextion 터치스크린의 소프트웨어를 설치했다면, 이제 터치스크린과 아두이노를 연결합니다. 그리고 터치스크린 소프트웨어에서 간단한 버튼 UI를 만든 뒤 아두이노의 LED를 ON, OFF 하는 동작/ 센서값을 확인하는 프로그램을 만들어 보도록 하겠습니다. [1] Nextion 터치스크린에 전원 연결하기 (1) 이 예제에서 사용한 Nextion 터치스크린 모델은 아래와 같습니다. 모델명: NX4832T035(구매링크 클릭) Nextion HMI LCD, 감압식 터치, 3.5인치 NX4832T035 , 기본형 : 터치스크린 > 디스플레이 LED/LCD 스마트 디스플레이, 터치디스플레이, 터치lcd, 480x320, 라즈베리 파이A+, B+ 그..
2022. 1. 21.
[009] 박스모델(block, inline)
콘텐츠 영역의 width(가로 길이), height(세로 길이) 조절하기 박스 모델의 콘텐츠 영역의 크기를 지정할 때는 width(가로길이), height(세로길이) 속성을 사용합니다. width, height 속성값: px(픽셀), cm(센티미터), 백분율(%), auto 등으로 지정할 수 있습니다. width와 height는 좌우 padding과 테두리(border) 두께를 합친 값입니다. [예제1] div박스에 width와 height 적용해보기 아래 코드에서, 빨간 div 박스는 px 고정값으로 설정하여 브라우저 창의 크기와 상관없이 크기가 유지된다. 반면에 파란 div 박스는 % 값으로 설정하여, 부모요소(body), 즉 웹 문서 창의 크기에 따라 달라진다. See the Pen 009_예제1 ..
2022. 1. 7.
