คุณเพิ่งเชิญศิลปศาสตร์เอกให้กับบ้านของคุณและคุณกำลังบอกเขา / เธอ

"คุณรู้ไหมว่าฉันเป็นโปรแกรมเมอร์ที่ยอดเยี่ยมและฉันสามารถทำ x และ y และ z ... "

เขาเบื่ออย่างรวดเร็วและขอให้คุณ:

"ถ้าคุณเป็นโปรแกรมเมอร์ที่ยอดเยี่ยมจริงๆคุณสามารถสร้างโปรแกรมเพื่อให้ฉันวาดฉันแค่ต้องวาดเส้นบนหน้าจอโดยใช้เมาส์และเลือกสีต่าง ๆ ในลักษณะใด ๆ "

รหัสของคุณอาจนำเข้าไลบรารีมาตรฐาน รหัสของคุณอาจต้องใช้สีเพื่อเลือกผ่านแป้นพิมพ์

นี่คือรหัสกอล์ฟ ; รหัสที่สั้นที่สุดชนะ

เครื่องหมายหัวข้อ

• เส้นจะถูกวาดโดยเลื่อนเมาส์ไปรอบ ๆ ในขณะที่กดปุ่มซ้าย

• อัลกอริทึม Line Bresenham ไม่จำเป็นต้องมีขั้นตอนวิธีการใด ๆ ในตัวจะทำเคล็ดลับ

• หากผู้ใช้สามารถเปลี่ยนความหนาของเส้นได้ทุกประการคุณจะได้รับโบนัส* 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.buttonsmousemove
• 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

มันใช้แบบนี้:

• คลิกและลากเพื่อวาดเส้นด้วยมือเปล่า

• กดปุ่มแท็บค้างไว้เพื่อเปลี่ยนสีและความหนาของเส้นขีด สิ่งนี้สามารถทำได้ในขณะที่วาด (ดูภาพ)

• กดปุ่มใดก็ได้ยกเว้นแท็บจากนั้นแท็บเพื่อล้างหน้าจอ

Python 2.7 - 339 197 324 * (0.7 * 0.8 * 0.9) = 163

แก้ไข: ฉันค้นพบ pygame สามารถวาดเส้นที่มีความกว้างของตัวแปรได้ดังนั้นนี่คือการอัปเดต

การทดลองในการใช้โมดูล PyGame

โปรแกรมระบายสีอย่างง่ายที่วาดเส้นจากเหตุการณ์ MOUSEDOWN (ค่า 5) ไปยังเหตุการณ์ MOUSEUP (ค่า 6) ใช้ฟังก์ชัน pygame.gfxdraw.line () การกดปุ่ม TAB จะวนไปมา 8 สี การกดปุ่ม BACKSPACE จะทำให้จอแสดงผลกลายเป็นกระดาษสีขาวที่ทำขึ้นอย่างระมัดระวัง ปุ่ม 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 อีกครั้งเมื่อล้น ดังนั้นนี่ทำให้เรามีสีมากมาย กันไปสำหรับความหนาของเส้นที่จะเพิ่มขึ้นตามสัดส่วนการถือหุ้นที การกดcจะเป็นการล้างแบบฟอร์ม

Mathematica - 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

สิ่งที่น่าสนใจที่สุดในที่นี้คือการใช้ตรรกะ bitwise บน scancode แป้นพิมพ์ปัจจุบันเพื่อเปลี่ยนสี ฉันใช้บิตที่แตกต่างกันสองตัวจาก scancode สำหรับแต่ละช่องทางดังนั้นเกือบ 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 BASIC - 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

Python 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()