방금 전공 교양을 집에 초대했는데

"알다시피, 저는 훌륭한 프로그래머이고 x와 y와 z를 할 수 있습니다 ..."

그녀는 빨리 지루해하며 다음과 같이 묻습니다.

"정말 훌륭한 프로그래머라면, 그림을 그릴 수있는 프로그램을 만들 수 있습니까? 마우스를 사용하고 어떤 방식 으로든 다른 색상을 선택하여 화면에 선을 그립니다."

코드에서 표준 라이브러리를 가져올 수 있습니다. 코드에 따라 키보드를 통해 색상을 선택해야 할 수도 있습니다.

이것은 코드 골프입니다 . 가장 짧은 코드가 승리합니다.

중요 항목

• 왼쪽 버튼을 누른 상태에서 마우스를 움직여 선을 그립니다.

• Bresenham의 Line Algorithm은 필요하지 않습니다. 내장 알고리즘이 트릭을 수행합니다.

• 사용자가 어떤 식 으로든 선 두께를 변경할 수있는 경우 * 0.8 보너스를 얻지 만 필수는 아닙니다.

• 선 그리기를 직접 구현하는 것이 더 좋을 것 같지만 원하는 경우 코드 설명에서 라이브러리를 가져올 수 있습니다.

• 최소값은 5 ​​가지 색상 (빨강, 녹색, 파랑, 흰색, 검은 색)입니다. 임의로 변경하면 * 1.2의 페널티를받습니다. 원하는 방식으로 변경할 수 있습니다 (버튼과 키 누름 모두 가능).

• 마우스를 포인트 또는 프리 핸드 사이로 누르는 것이 가장 좋으며 (페인트에서와 같이) 보너스는 * 0.7이지만 다른 방법은 괜찮습니다. (예) 두 포인트를 클릭하고 해당 포인트 사이에 선을 그립니다 ?

• 드로잉 캔버스는 600x400이어야합니다.

• 색상을 변경하면 나중에 그려 질 선의 색상 만 변경해야합니다.

• "모두 지우기"명령을 구현하는 것은 필수는 아니지만 구현하면 * 0.9 보너스를받습니다.

HTML + jQuery + CSS-507 x (0.7 x 0.8 x 0.9) = 255.528

내가 생각했던만큼 짧지는 않지만 결과는 마음에 든다.

풍모:

• 클릭 앤 드래그 드로잉 모드. ( 0.7 )
• 일곱 가지 색상 (검은 색 + 무지개).
• 다양한 브러시 폭 (슬라이더 제어). ( 0.8 )
• 모든 기능을 해제하십시오. ( 0.9 )

라이브 데모 : http://jsfiddle.net/onsLkh8y/9/

HTML-84 바이트

<input id="r" type="range" min="1" max="9"><canvas id="c" width="600" height="400"/>

CSS-35 바이트

#c{border:1px solid;cursor:pointer}

jQuery-388/446 바이트

W3C 호환 브라우저 (예 : Chrome)-388 바이트

var t=c.getContext('2d');$.each('black0red0orange0yellow0green0blue0purple0clear'.split(0),function(k,v){
$(r).before($('<button>'+v+'</button>').click(function(){k>6?t.clearRect(0,0,600,400):t.strokeStyle=v}))})
$(c).mousedown(function(e){t.lineWidth=$(r).val();t.beginPath();t.moveTo(e.offsetX,e.offsetY)})
.mousemove(function(e){if(e.which==1){t.lineTo(e.offsetX,e.offsetY);t.stroke()}})

크로스 브라우저 버전 (Firefox, Safari, IE 용 수정)-446 바이트

var t=c.getContext('2d');$.each('black0red0orange0yellow0green0blue0purple0clear'.split(0),function(k,v){
$(r).before($('<button>'+v+'</button>').click(function(){k>6?t.clearRect(0,0,600,400):t.strokeStyle=v}))})
var d,p=$(c).offset();$(c).mousedown(function(e){d=t.lineWidth=$(r).val();t.beginPath()t.moveTo(e.pageX-p.left,
e.pageY-p.top)}).mousemove(function(e){if(d){t.lineTo(e.pageX-p.left,e.pageY-p.top);t.stroke()}}).mouseup(function(){d=0})

수정 :

• FireFox- event.offset[X|Y]정의되지 않았습니다.
• 사파리 - event.which와 event.buttons의미에 정의되어 있지 않습니다 mousemove.
• Internet Explorer-위의 두 가지 수정 사항을 모두 사용할 e.buttons수 있지만 사용 하면 충분합니다.

가공-93 · 0.9 = 83.7

처리에 대한 오버 헤드가 없지만 매우 장황한 구문을 처리하면 멋진 기능과 보너스가 없으면 최고 점수에 도달 할 수 있습니다.

void setup(){
size(600,400);
}
void draw(){
if(mousePressed)line(mouseX,mouseY,pmouseX,pmouseY);
}

점수 : 93 · 0.9 = 83.7 (줄 바꿈은 가독성을위한 것이며 점수에 포함되지 않습니다.)

그러나 모든 보너스를 적용하면 훨씬 재미 있습니다.

void setup(){
size(600,400);
}
int i,x,y;
void draw(){
stroke(7*i%256,5*i%256,i%256);
strokeWeight(i%9);
if(keyPressed)i++;
if(!mousePressed){x=mouseX;y=mouseY;if(x<0)background(0);}
}
void mouseReleased(){
line(x,y,mouseX,mouseY);
}

점수 : 221 · 0.8 · 0.7 · 0.9 = 111.4

다음과 같이 사용됩니다.

• 마우스를 클릭하고 드래그하여 직선을 그립니다.

• 클릭 한 상태에서 마우스를 창의 왼쪽에서 드래그하여 마우스 버튼을 놓아 화면을 지우십시오.

• 키를 누르고 있으면 드로잉 색상의 빨강, 녹색 및 파랑 값과 다른 획 두께가 순환됩니다. 사이클링 기간이 다르기 때문에 실제로 모든 조합에 도달 할 수 있습니다 (약간의 노력으로).

편집하다:

자유형 그리기도 0.7 보너스를주기 때문에 여기 또 다른 해결책이 있습니다.

void setup(){
size(600,400);
}
int i;
void draw(){
stroke(7*i%256,5*i%256,i%256);
strokeWeight(i%9);
if(keyPressed)i++;
if(key>9)background(0);
if(mousePressed)line(mouseX,mouseY,pmouseX,pmouseY);
}

점수 : 188 · 0.8 · 0.7 · 0.9 = 94.8

다음과 같이 사용됩니다.

• 자유형 선을 그리려면 클릭하고 드래그하십시오.

• 색상 및 선 두께를 변경하려면 탭 키를 누르고 있습니다. 이 작업은 그림을 그리는 동안 수행 할 수도 있습니다 (그림 참조).

• 화면을 지우려면 Tab 키를 누른 다음 Tab 키를 누르십시오.

파이썬 2.7 - 339 197 324 * (0.7 * 0.8 * 0.9) 163 =

편집 : 파이 게임이 가변 너비로 선을 그릴 수 있다는 것을 발견 했으므로 여기에 업데이트가 있습니다.

PyGame 모듈 사용 실험.

MOUSEDOWN 이벤트 (값 5)에서 MOUSEUP 이벤트 (값 6)까지 선을 그리는 간단한 페인트 프로그램입니다. pygame.gfxdraw.line () 함수를 사용합니다. Tab 키를 누르면 8 가지 색상으로 순환합니다. 백 스페이스 키를 누르면 조심스럽게 제작 된 흰색 용지로 디스플레이가 지워집니다. ENTER 키는 브러시 크기를 0-7 픽셀 너비로 순환시킵니다.

코드 골프를 처음 사용하므로 코드 크기를 줄이는 몇 가지 방법을 놓쳤을 수 있습니다.

import pygame as A,pygame.draw as G
P=A.display
D=P.set_mode((600,400))
C=(0,255)
S=[(r,g,b) for r in C for g in C for b in C]
w=n=1
while n:
 e=A.event.wait()
 t=e.type
 if t==12:n=0
 if t==2:
  if e.key==9:n+=1
  if e.key==13:w+=1
  if e.key==8:D.fill(S[7])
 if t==5:p=e.pos
 if t==6:G.line(D,S[n%8],p,e.pos,w%8)
 P.flip()

샘플 사진 1 :

샘플 사진 2 :

C # 519 x 0.7 x 0.8 x 0.9 = 261.6 DrawLine 방법 사용.

골프 :

using System;using System.Drawing;using System.Windows.Forms;class f:Form{[STAThread]static void Main(){f F=new f{Width=600,Height=400};Point s=default(Point);sbyte[]c={0,0,0,1};F.MouseDown+=(_,e)=>{s=new Point(e.X,e.Y);};F.MouseUp+=(_,e)=>{F.CreateGraphics().DrawLine(new Pen(Color.FromArgb(255,c[0],c[1],c[2]),c[3]),s.X,s.Y,e.X,e.Y);};F.KeyPress+=(a,e)=>{unchecked{switch(e.KeyChar){case'r':c[0]++;break;case'g':c[1]++;break;case'b':c[2]++;break;case't':c[3]++;break;case'c':F.Invalidate();break;}}};F.ShowDialog();}}

읽을 수있는 :

using System;
using System.Drawing;
using System.Windows.Forms;

class f : Form
{
    [STAThread]
    static void Main()
    {
        f F = new f { Width = 600, Height = 400 };
        Point s = default(Point);
        sbyte[] c = { 0, 0, 0, 1 };
        F.MouseDown += (_, e) => { s = new Point(e.X, e.Y); };
        F.MouseUp += (_, e) => { F.CreateGraphics().DrawLine(new Pen(Color.FromArgb(255, c[0], c[1], c[2]), c[3]), s.X, s.Y, e.X, e.Y); };
        F.KeyPress += (a, e) =>
        {
            unchecked
            {
                switch (e.KeyChar)
                {
                    case 'r': c[0]++; break;
                    case 'g': c[1]++; break;
                    case 'b': c[2]++; break;
                    case 't': c[3]++; break;
                    case 'c': F.Invalidate();break;
                }

            }
        };
        F.ShowDialog();
    }
}

유지하여 R , G 또는 B를 키보드는 해당 인덱스에서 sbyte 어레이를 증가시켜 다음 라인의 색을 변경한다. 넘치면 다시 0에서 시작합니다. 그래서 이것은 우리에게 많은 색을 제공합니다. t 를 유지하여 증가하는 선의 두께도 동일 합니다. c 를 누르면 양식이 지워집니다.

수학-333 x 0.7 x 0.8 x 0.9 = 168

l = {}; c = Black; s = .01;
ColorSetter@Dynamic@c
Dynamic@s~Slider~{0, .02}
Button["Clear", l = {}]
"/" Checkbox@Dynamic@b
EventHandler[
 Dynamic@Graphics@{White, Rectangle@{600, 400}, l},
 {"MouseDown" :> 
   AppendTo[l, p = {}; {c, Thickness@s, Line@Dynamic@p}], 
  "MouseDragged" :> (p = 
     Append[p, MousePosition@"Graphics"][[If[b, {1, -1}, All]]]),
  "MouseUp" :> (l[[-1, 3]] = Line@p)
  }
 ]

Tcl / Tk, 252

x 0,8 x 0,7 x 0,9

= 127,008

253 x 0,8 x 0,7 x 0,9 = 127,512

254 x 0,8 x 0,7 x 0,9 = 128,016

255 x 0,8 x 0,7 x 0,9 = 128,52

grid [canvas .c -w 600 -he 400]
set c red
incr t
lmap k {1
B1-Motion
3
MouseWheel
2} s {{set L [.c cr l %x %y %x %y -f $c -w $t]}
{.c coo $L "[.c coo $L] %x %y"}
{set c [tk_chooseColor]}
{if $t|%D>0 {incr t [expr %D/120]}}
{.c de all}} {bind . <$k> $s}

grid [canvas .c -w 600 -he 400]
set c red
set t 0
bind .c <1> {set L [.c cr l %x %y %x %y -f $c -w $t]}
bind .c <B1-Motion> {.c coo $L "[.c coo $L] %x %y"}
bind .c <3> {set c [tk_chooseColor]}
bind .c <MouseWheel> {if $t||%D>0 {incr t [expr %D/120]}}
bind .c <2> {.c de all}

그것을 사용하려면 :

• 마우스 왼쪽 버튼은 질문 요청으로 동작
• 초기 색상은 빨간색입니다. 마우스 오른쪽 버튼을 클릭하면 다음에 사용할 색상을 선택할 수있는 대화 상자가 나타납니다. 항상 OK 버튼을 누르면 색상이 정의되지 않습니다. 이 문제를 해결할 수는 있지만 바이트를 소비합니다.
• 다음에 사용할 선의 두께를 조정하려면 마우스 휠을 회전시킬 수 있습니다 : 위로 = 두껍게, 아래로 = 얇게
• 이미지를 지우려면 마우스 가운데 버튼을 누르십시오

간단한 테스트 :

DarkBASIC Pro-318 x 0.7 x 0.9 = 200.34

여기서 가장 흥미로운 것은 현재 키보드 스캔 코드에서 비트 논리를 사용하여 색상을 변경하는 것입니다. 각 채널마다 스캔 코드에서 두 개의 다른 비트를 사용하므로 거의 모든 6 비트 색상이 가능합니다.

• 색상을 사용하려면 키보드의 아무 키나 누르십시오 (미국 키보드 : 흰색 = F5, 검은 색 = 키 없음, 빨간색 = 2, 녹색 =-(빼기), 파랑 = b)
• 마우스 오른쪽 버튼을 클릭하여 지 웁니다.

다음은 컴파일 된 EXE입니다. 다운로드

#constant a set current bitmap
set display mode 800,400,32
create bitmap 1,800,400
do
s=scancode()
ink rgb((s&&3)*85,((s/4)&&3)*85,((s>>4)&&3)*85),0
m=mousex()
n=mousey()
o=mouseclick()
if o*(d=0) then d=1:x=m:y=n
a 1
if (o=0)*d then d=0:line x,y,m,n
if o=2 then cls
a 0
cls
copy bitmap 1,0
if d then line x,y,m,n
loop

BBC 기본-141 보너스 없음

내 첫 프로그래밍 언어이며 일반적으로 더 이상 사용하지 않습니다 :)

SYS "SetWindowPos",@hwnd%,0,0,0,600,400,6:VDU 26
1 MOUSE X,Y,b
IF b=4 THEN GOTO 4
GOTO 1
4 MOUSE x,y,b
IF b=0 THEN LINE X,Y,x,y:GOTO 1
GOTO 4

파이썬 2.7-384 * .8 * .7 = 215.04

from Tkinter import*;o=1
a='0f';C=['#'+r+g+b for r in a for g in a for b in a]
def i(a):global o;o+=1
def d(a):global o;o-=1
def I(a):global u;u+=1
def D(a):global u;u-=1
m=Tk();u=0;c=Canvas(width=600,height=400);c.bind("<B1-Motion>",lambda x:c.create_rectangle((x.x,x.y,x.x+o,x.y+o),fill=C[u],outline=C[u]));m.bind("q",i);m.bind("w",d);m.bind("x",D);m.bind("z",I);c.pack();mainloop()

모든 보너스 포함 : 462 * .9 * .8 * .7 = 232.848

from Tkinter import*;o=1
a='0f';C=['#'+r+g+b for r in a for g in a for b in a]
def i(a):global o;o+=1
def d(a):global o;o-=1
def I(a):global u;u+=1
def D(a):global u;u-=1
m=Tk();u=0;c=Canvas(width=600,height=400);c.bind("<B1-Motion>",lambda x:c.create_rectangle((x.x,x.y,x.x+o,x.y+o),fill=C[u],outline=C[u]));m.bind("q",i);m.bind("w",d);m.bind("x",D);m.bind("z",I);m.bind("m",lambda _:c.create_rectangle((0,0,602,402),fill=C[7],outline=C[5]));c.pack();mainloop()