Hai appena invitato un maggiore di arti liberali a casa tua e glielo stai dicendo

"Sai, sono un grande programmatore e posso fare x e ye z ..."

Si annoia rapidamente e ti chiede:

"Se sei davvero un grande programmatore, puoi creare un programma per farmi disegnare, ho solo bisogno di disegnare linee sullo schermo usando il mouse e selezionando colori diversi in qualsiasi modo".

Il tuo codice può importare librerie standard. Il codice potrebbe richiedere la selezione dei colori tramite la tastiera.

Questo è code-golf ; vince il codice più breve.

Elenco puntato

• Le linee vengono disegnate spostando il mouse mentre si preme il pulsante sinistro.

• L'algoritmo di linea di Bresenham non è necessario, nessun algoritmo integrato farà il trucco

• Se l'utente può modificare lo spessore della linea in qualsiasi modo, ricevi un bonus di * 0,8 ma non è obbligatorio.

• Immagino che dovrebbe essere più semplice implementare il disegno a tratteggio noi stessi, ma se vuoi puoi importare una libreria per quello basta dirlo nella descrizione del codice.

• Il minimo è di 5 colori diversi (rosso, verde, blu, bianco, nero). Se le fai cambiare casualmente, ricevi una penalità di * 1.2. Puoi cambiarli in qualsiasi modo tu voglia (sia i pulsanti che i tasti premuti sono OK).

• Disegnarli premendo il mouse tra i punti o a mano libera sarebbe la cosa migliore (cioè come fai con la vernice) e ti dà un bonus di * 0,7, ma qualsiasi altro metodo va bene: (esempio) fai clic su due punti e traccia una linea tra quei punti ?

• La tela del disegno deve essere 600x400

• La modifica del colore dovrebbe cambiare solo il colore delle linee che verranno disegnate in futuro.

• L'implementazione di un comando "Cancella tutto" non è obbligatoria ma se si implementa si ottiene un bonus di * 0.9 .

HTML + jQuery + CSS - 507 x (0,7 x 0,8 x 0,9) = 255,528

Non così breve come pensavo, ma il risultato mi piace.

Caratteristiche:

• Fare clic e trascinare la modalità di disegno. ( 0.7 )
• Sette colori (nero + arcobaleno).
• Larghezza pennello variabile (controllo cursore). ( 0.8 )
• Cancella tutte le funzioni. ( 0.9 )

Demo live: http://jsfiddle.net/onsLkh8y/9/

HTML - 84 byte

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

CSS - 35 byte

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

jQuery - 388/446 byte

Browser compatibili con W3C (ad es. Chrome) - 388 byte

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

Versione cross-browser (correzioni per Firefox, Safari, IE) - 446 byte

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})

correzioni:

• FireFox - event.offset[X|Y] non definito.
• Safari - event.whiche event.buttonsnon sono definiti in modo significativomousemove .
• Internet Explorer: funziona con entrambe le correzioni precedenti, sebbene l'utilizzo e.buttonssarebbe stato sufficiente.

Elaborazione - 93 · 0.9 = 83.7

Con quasi nessun sovraccarico per il disegno, ma una sintassi molto dettagliata, in Elaborazione il punteggio migliore è probabilmente raggiunto senza caratteristiche carine e un solo bonus:

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

Punteggio: 93 · 0,9 = 83,7 (le nuove righe sono solo per la leggibilità e non vengono conteggiate nel punteggio).

Tuttavia, è molto più divertente con tutti i bonus in atto:

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);
}

Punto: 221 · 0,8 · 0,7 · 0,9 = 111,4

È usato così:

• Fare clic e trascinare il mouse per disegnare una linea retta.

• Facendo clic, trascinare il mouse dal lato sinistro della finestra e rilasciare il pulsante del mouse per cancellare lo schermo.

• Tenendo premuto un tasto qualsiasi, scorrerai tra i valori rosso, verde e blu del colore del disegno e attraverso diversi spessori di tratto. Poiché i periodi di ciclismo sono diversi, praticamente tutte le combinazioni sono raggiungibili (con un po 'di tentativi).

Modificare:

Poiché il disegno a mano libera offre anche il bonus di 0,7, ecco un'altra soluzione:

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);
}

Punteggio: 188 · 0,8 · 0,7 · 0,9 = 94,8

È usato così:

• Fare clic e trascinare per disegnare linee a mano libera.

• Tenere premuto il tasto Tab per modificare il colore e lo spessore del tratto. Questo può essere fatto anche durante il disegno (vedi foto).

• Premi qualsiasi tasto tranne la scheda e quindi la scheda per cancellare lo schermo.

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

Modifica: ho scoperto che pygame può disegnare linee con larghezza variabile, quindi ecco un aggiornamento.

Un esperimento sull'uso dei moduli PyGame.

Un semplice programma di disegno che disegna linee dall'evento MOUSEDOWN (valore 5) all'evento MOUSEUP (valore 6). Utilizza la funzione pygame.gfxdraw.line (). Premere il tasto TAB per scorrere tra 8 colori. Premendo il tasto BACKSPACE si cancella il display in un colore bianco di carta accuratamente realizzato. Il tasto INVIO farà scorrere la dimensione del pennello tra 0 e 7 pixel in larghezza.

Sono nuovo a code-golf, quindi potrei aver perso alcuni metodi per ridurre le dimensioni del codice.

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

Immagine di esempio 1:

Immagine di esempio 2:

C # 519 x 0,7 x 0,8 x 0,9 = 261,6 utilizzando il metodo DrawLine.

golfed:

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();}}

Leggibile:

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();
    }
}

Tenendo premuto r , g o b sulla tastiera, cambia il colore della riga successiva incrementando un array sbyte nell'indice corrispondente. Ricomincerà da 0 quando trabocca. Quindi questo ci dà molti colori. Lo stesso vale per lo spessore della linea che viene aumentato tenendo premuto t . Premendo c si cancella il modulo.

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}

Per usarlo:

• Il pulsante sinistro del mouse si comporta come una domanda
• Il colore iniziale è rosso. Il mouse destro mostra una finestra di dialogo che consente all'utente di scegliere il colore che verrà utilizzato la volta successiva. Premere sempre il pulsante OK, altrimenti il ​​colore non sarà definito. Potrei risolvere questo problema, ma consumerebbe byte
• Per regolare lo spessore della linea che verrà utilizzata la prossima volta, è possibile ruotare la rotellina del mouse: Su = più spesso, Giù = più sottile
• Per cancellare l'immagine premere il pulsante centrale del mouse

Un semplice test:

DarkBASIC Pro - 318 x 0,7 x 0,9 = 200,34

La cosa più interessante qui è usare una logica bit a bit sull'attuale codice tastiera per cambiare il colore. Uso due bit diversi dallo scancode per ciascun canale, quindi è possibile quasi ogni colore a 6 bit.

• Tieni premuto un tasto qualsiasi della tastiera per usare un colore (sulla mia tastiera americana: Bianco = F5, Nero = nessun tasto, Rosso = 2, Verde = - (meno), Blu = b)
• Fare clic con il tasto destro per cancellare

Ecco un EXE compilato: Download

#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 nessun bonus

Il mio primo linguaggio di programmazione e generalmente mai più usato da me :)

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

Con tutti i bonus: 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()