coding-abc.tistory.com

파이썬, tkinter 위젯 배치하기: place()

tkinter의 place() 함수는 위젯을 절대 좌표(픽셀 단위) 또는 비율(상대 좌표) 로 배치할 때 사용합니다.즉, 화면에서 정확한 위치에 위젯을 두고 싶을 때 유용합니다.📝 place() 함수의 주요 옵션x, y : 위젯의 왼쪽 위 모서리를 기준으로 하는 좌표 (픽셀 단위)relx, rely : 부모 위젯(창)의 가로, 세로 크기에 대한 상대 좌표 (0.0 ~ 1.0)width, height : 위젯의 가로, 세로 크기 (픽셀 단위)relwidth, relheight : 부모 위젯 크기에 대한 상대 크기 (0.0 ~ 1.0)anchor : 기준점을 바꿀 수 있음 (예: "center", "n", "e", "w", "s", "ne", "sw" 등)📌 예제 1: 절대 좌표로 배치import tki..

tkinter에서 grid()는 위젯을 행(row), 열(column) 단위로 배치할 때 사용하는 메서드입니다.엑셀 표처럼 격자(Grid) 개념으로 배치할 수 있어서 pack()보다 직관적일 때가 많습니다.📌 기본 문법위젯.grid(row=행번호, column=열번호, 옵션...) row : 배치할 행 번호 (0부터 시작)column : 배치할 열 번호 (0부터 시작)rowspan : 위젯이 차지할 행의 개수columnspan : 위젯이 차지할 열의 개수sticky : 셀 안에서 위젯의 정렬 (N, S, E, W 조합)padx, pady : 셀 안에서 여백📌 간단 예제import tkinter as tkroot = tk.Tk()root.title("grid() 예제")# 레이블label1 = tk.L..

파이썬, tkinter의 pack()을 활용한 몇 가지 위젯 배치 예제를 만들어 봅니다.pack()은 위젯을 상하좌우 방향으로 자동 배치할 때 유용하고, side, fill, expand 옵션 조합에 따라 다양한 배치 패턴을 만들 수 있습니다.1. 기본 세로 배치 (기본값: side="top")import tkinter as tkroot = tk.Tk()tk.Button(root, text="버튼 1").pack()tk.Button(root, text="버튼 2").pack()tk.Button(root, text="버튼 3").pack()root.mainloop()특징: 위에서부터 차례로 쌓임.2. 가로 배치 (side="left")import tkinter as tkroot = tk.Tk()tk.But..

자바스크립트 배열(Array)에 대해 정리해 봅니다.📌 자바스크립트 배열 (Array)1. 배열이란?여러 개의 값을 하나의 변수에 저장할 수 있는 자료구조.값은 인덱스(index, 0부터 시작) 로 접근합니다.let fruits = ["사과", "바나나", "포도"];console.log(fruits[0]); // "사과"console.log(fruits[2]); // "포도" 2. 배열 생성 방법let arr1 = [1, 2, 3]; // 리터럴 방식let arr2 = new Array(4, 5, 6); // 생성자 방식 3. 주요 속성let nums = [10, 20, 30];console.log(nums.length); // 3 (배열 길이) 4. 배열 주요 메서드➡..

자바스크립트의 setInterval() 함수에 대해 설명합니다.📌 setInterval() 이란?특정 시간마다 반복적으로 함수를 실행합니다.멈추려면 반드시 clearInterval() 을 사용해야 합니다.📌 문법setInterval(실행할_함수, 지연시간(ms), [추가인자...]);실행할_함수: 일정 주기마다 실행할 함수지연시간(ms): 반복 실행 간격 (1000ms = 1초)추가인자: 함수에 전달할 인자 (옵션)📌 기본 예제let count = 0;let timerId = setInterval(() => { count++; console.log("⏰ " + count + "초 경과"); if (count === 5) { clearInterval(timerId); // 5초 뒤 멈춤 ..

자바스크립트의 setTimeout() 은 특정 시간이 지난 후에 한 번만 함수를 실행하도록 예약하는 타이머 함수입니다.📌 문법setTimeout(실행할_함수, 지연시간(ms), [추가인자...]);실행할_함수: 일정 시간이 지난 뒤 실행할 함수지연시간(ms): 밀리초 단위 (1000ms = 1초)추가인자: 함수에 전달할 인자(옵션)📌 기본 예제console.log("1. 시작");setTimeout(() => { console.log("2. 2초 후 실행됨");}, 2000); // 2000ms = 2초console.log("3. 끝"); 실행 순서console.log("1. 시작") → 바로 출력setTimeout 예약 (2초 후 실행)console.log("3. 끝") → 바로 출력약 2초 후 ..

✅ onload 이벤트란?onload 이벤트는 웹 페이지나 특정 요소(예: 이미지, iframe 등)가 모두 로드(불러오기)된 후 발생하는 이벤트입니다.주로 페이지가 다 준비된 뒤 실행해야 하는 코드를 넣을 때 사용합니다.예를 들어, DOM 요소 접근, 초기화 작업, 이미지 크기 계산 같은 것들이 이에 해당합니다.✅ 문법 또는 자바스크립트 코드에서 직접 등록할 수도 있습니다:window.onload = function() { // 실행할 코드};✅ 간단한 예제👉 웹 페이지가 로드되면 "페이지 로딩이 완료되었습니다!" 라는 메시지를 띄우는 예제입니다. onload 이벤트 예제 페이지가 아직 준비되지 않았습니다... 📌 실행 흐름:브라우저가 HTML과 리소스를 모두 읽음 →window.onloa..

onchange 이벤트는 사용자가 , , 등의 값(value)을 변경했을 때 발생하는 이벤트입니다.즉, 값이 바뀌고 요소가 포커스를 잃었을 때 실행됩니다. (즉시 실행되는 oninput과는 다릅니다.)✅ 특징주로 입력값 확인, 폼 자동 처리, 선택값에 따른 UI 변경 등에 사용됩니다.예: 드롭다운에서 옵션을 바꾸면 해당 옵션에 따라 다른 내용을 표시하기.📌 예제: 드롭다운 선택 시 메시지 출력 과일을 선택하세요: -- 선택 -- 사과 바나나 포도 👉 드롭다운에서 과일을 선택하면 onchange 이벤트가 실행되어 문구가 바뀝니다.원하시면 제가 onchange와 oninput의 차이를 간단히 비교하는 예제도 만들어 드릴까요?

아래 코드는 버튼을 클릭할 때마다 문자열과 배경을 변경하는 자바스크립트 코드입니다. 버튼을 눌러보세요 😀 클릭

자바스크립트 이벤트 속성은 HTML 요소에서 특정 동작(클릭, 키 입력, 마우스 이동 등)이 발생했을 때 실행되는 이벤트 핸들러 속성을 말합니다.아래에 주요 이벤트 속성들을 카테고리별로 정리했습니다.마우스 관련 이벤트키보드 관련 이벤트폼(form) 관련 이벤트윈도우/문서 관련 이벤트드래그 & 드롭 관련 이벤트기타1. 마우스 관련 이벤트이벤트 속성설명onclick요소를 클릭했을 때 실행 https://coding-abc.tistory.com/388ondblclick요소를 더블 클릭했을 때 실행onmousedown마우스를 누를 때 실행onmouseup마우스를 뗄 때 실행onmousemove마우스를 움직일 때 실행onmouseover마우스를 요소 위에 올렸을 때 실행onmouseout마우스가 요소에서 벗어날..