>  기사  >  웹 프론트엔드  >  preload() 함수 사용 및 이미지 업로드

preload() 함수 사용 및 이미지 업로드

php中世界最好的语言
php中世界最好的语言원래의
2018-06-15 14:34:472170검색

이번에는 preload() 함수 사용 및 이미지 업로드에 대해 소개해 드리겠습니다. preload() 함수 사용 및 이미지 업로드 시 주의사항은 무엇인가요?

preload() 함수는 setup()과 유사하며 프로그램 시작 시 setup() 전에 한 번만 실행됩니다.

일반적으로 preload()에는 미디어 파일(사진, 사운드)을 로드하는 명령문을 넣습니다. 왜냐하면 preload()에는 로드될 때까지 프로그램이 시작되지 않는 기능이 있기 때문입니다. 프로그램이 실행 중입니다.

이미지를 로드하기 전에 먼저 이미지 파일을 업로드해야 합니다.

방법은 다음과 같습니다.

①편집기 왼쪽 상단에 있는 작은 삼각형을 클릭하면 파일 디렉터리가 확장됩니다.

②파일 디렉터리 오른쪽 상단에 있는 작은 삼각형을 클릭하고 메뉴를 확장한 후 파일을 추가합니다.

③이미지 파일을 박스에 직접 드래그하시면 자동으로 업로드되며, 업로드 후 닫으시면 됩니다. jpg, png 형식 모두 지원됩니다.

2. 이미지 로드

다음과 같이 코드를 추가합니다.

var img; 
function preload(){ 
 //加载图片文件 
 img=loadImage("HearthStone.png"); 
} 
 
function setup() {  
 createCanvas(400, 400); 
}  
 
function draw() {  
 background(220); 
 //坐标原点设为图片中心 
 imageMode(CENTER); 
 //绘制图片 
 image(img,200,200); 
}

두 가지 기능이 있습니다.

imageMode(): 이미지의 중심을 설정합니다. 일반적으로 사용되는 기능은 CENTER입니다. , CORNER, CENTER가 중앙, CORNER가 왼쪽 상단

image(): 그림을 그리고, image("이미지 주소",x,y)

Rendering:

3. 그리고 Stretching

p5.js는 염색, 스트레칭 등 몇 가지 편리한 기능도 제공합니다. 코드는 다음과 같습니다.

var img; 
function preload(){ 
 //加载图片文件 
 img=loadImage("HearthStone.png"); 
} 
 
function setup() {  
 createCanvas(400, 400); 
}  
 
function draw() {  
 background(220); 
 //坐标原点设为图片中心 
 imageMode(CENTER); 
 //图片染色 
 tint(0,255,255); 
 //绘制图片,后两个参数调整长宽 
 image(img,200,200,150,150); 
}

tint(): 이미지를 염색하고 괄호 안에 색상을 입력합니다. 형식은 다음과 같습니다. fill()

image(): 네 번째 및 다섯 번째 매개변수는 이미지 길이와 너비입니다. 입력하지 않으면 원본 이미지 길이와 너비가 사용됩니다.

Rendering:

믿습니다. 이 기사의 사례를 읽은 후 방법을 익혔습니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!

추천 도서:

JS 동적 추가 방법과 PHP 동적 추가 방법 비교

Linux를 사용하여 .vimrc 파일을 반복적으로 로드하는 방법

위 내용은 preload() 함수 사용 및 이미지 업로드의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.