Einführung

Eines Tages haben Sie Ihrem Kind gezeigt, wie man an einem Computer zeichnet. Sie geben mspaint.exedie Laufleiste ein. Zu Ihrem Entsetzen heißt es "Keine Artikel entsprechen Ihrer Suche". Sie müssen eine einfache Version der Farbe erstellen, damit Ihr Kind zeichnen kann!

Herausforderung

Sie müssen ein einfaches Zeichenprogramm erstellen. Öffnen Sie dazu ein weißes Anzeigefenster (größer als 99x99 Pixel). Ändern Sie bei jedem Herunterdrücken der Maus das Pixel, auf dem sich die Maus befindet, in Schwarz.

Das ist Code-Golf , also gewinnt die kürzeste Antwort in Bytes!

8086 Maschinencode, 32 31 28 26 Bytes

00000000  b8 0f 00 cd 10 b8 02 10  ba 18 01 cd 10 b8 03 00  |................|
00000010  cd 33 4b b8 01 0c eb f3  3f 00                    |.3K.....?.|
0000001a

Vorausgesetzt, dass eine VGA-Grafikkarte und ein Microsoft-kompatibler Maustreiber vorhanden sind.

-2 Bytes dank @berendi!

Wie es funktioniert:

            |   org 0x100
            |   use16
b8 0f 00    |       mov ax, 0x000f      ; set screen mode: 640x350 monochrome
cd 10       |       int 0x10            ; call video bios
b8 02 10    |       mov ax, 0x1002      ; set palette
ba 18 01    |       mov dx, palette     ; pointer to palette data
cd 10       |   @@: int 0x10            ; call video bios
b8 03 00    |       mov ax, 0x0003      ; get mouse position in (CX, DX) and button status in BL
cd 33       |       int 0x33            ; call mouse driver
4b          |       dec bx              ; if no buttons pressed, --BX = 0xFFFF (invalid page)
b8 01 0c    |       mov ax, 0x0c01      ; plot pixel with color AL at (CX, DX) in page BH
eb f3       |       jmp @b              ; repeat
3f 00       |   palette db 0x3f, 0x00   ; palette in 2:2:2 rgb. color 0 = white, 1 = black.
            |                           ; this should be a 17-byte struct, but we only care about the first two colors here

Das ist alles dazu. Keine Zauberei, nur ein paar Funktionsaufrufe.

Scratch, 10 Scratch-Bytes

Scratch wurde praktisch für solche Dinge entwickelt.

Probieren Sie es online!

HTML + JavaScript (ES6), 66 64 62 Byte

HTML

<canvas id=c>

JavaScript

onclick=e=>c.getContext`2d`.fillRect(e.x,e.y,1,1)

2 Bytes dank Gustavo Rodrigues und 2 Bytes von Shaggy gespeichert.

onclick=e=>c.getContext`2d`.fillRect(e.x,e.y,1,1)

/* This css isn't needed for the program to work. */
*{margin: 0}
#c{border:1px solid black}

<canvas id=c>

C + Win32, 209 200 195 Bytes

Danke, Cody und Quentin! Ich hatte gehofft, das loszuwerden, #include <windows.h>aber das führt zu allen möglichen Fehlern. Zumindest funktioniert es mit mehreren Monitoren richtig ...

#include<windows.h> 
struct{int h,m,w,x:16,y:16;}m;h;main(){for(h=CreateWindow("EDIT","",1<<28,0,0,199,199,0,0,0,0);GetMessage(&m,h,0,0);m.m^513?DispatchMessage(&m):SetPixel(GetDC(h),m.x,m.y,0));}

Vorheriger Code:

#include<windows.h> 
main(){MSG m;HWND h;for(h=CreateWindow("EDIT","",1<<28,0,0,199,199,0,0,0,0);GetMessage(&m,h,0,0);m.message^513?DispatchMessage(&m):SetPixel(GetDC(h),LOWORD(m.lParam),HIWORD(m.lParam),0));}

Verarbeitung, 98 79 Bytes

Dank @dzaima wurden 19 Bytes gespeichert

void setup(){background(-1);}void draw(){if(mousePressed)point(mouseX,mouseY);}

Erklärung (veraltet)

void setup() {
  size(100,100);            // size of the sketch
  background(-1);           // set the background to white
                            // 1 byte shorter than background(255);
}

void draw(){}               // required for mousePressed to work

void mousePressed() {       // function that is called whenever the mouse is pressed
  point(mouseX, mouseY);    // draw a point at the mouse's coordinates
                            // the colour is set to black as default
}

JavaScript ES6, 126 Byte

In Chrom getestet.

onclick=e=>document.body.outerHTML+=`<a style=position:fixed;top:${e.y}px;left:${e.x}px;width:1px;height:1px;background:#000>`

Probieren Sie es online!

onclick=e=>document.body.outerHTML+=`<a style=position:fixed;top:${e.y}px;left:${e.x}px;width:1px;height:1px;background:#000>`

Haskell, 189 184 170 169 Bytes

import Graphics.Gloss.Interface.Pure.Game
main=play FullScreen white 9[]Pictures(#)(\_->id)
EventKey(MouseButton LeftButton)Down _(x,y)#l=Translate x y(Circle 1):l
_#l=l

Dies verwendet die GlossBibliothek (v1.11). Es öffnet sich ein Vollbildfenster und malt mit der linken Maustaste schwarze Pixel (tatsächlich Kreise mit Radius 1). Drücken Sie, ESCum das Menü zu verlassen.

Wie es funktioniert:

play                 -- handles the whole event handling, screen update, etc. process
    FullScreen       -- use a full screen window
    white            -- use a white background
    9                -- 9 simulation steps per second (see simulation handler below)
    []               -- the initial world state, an emtpy list of circles
    Pictures         -- a function to turn the world state into a picture.
                     -- The world state is a list of translated circles and
                     -- "Pictures" turns this list into a single picture
    (#)              -- event handler, see below
    (\_->id)         -- simulation step handler. Ignore time tick and return the
                     -- world state unchanged. More readable: "\tick world -> world"

EventKey ... # l=... -- if the left mouse button is pressed, add a circle with
                     -- radius 1 translated to the current position of the mouse
                     -- to the world state
_#l=l                -- on all other events do nothing

Edit: @ nicht mehr gegen den Uhrzeigersinn zu drehen, erzählte mir von der neuesten Version von Gloss, die 5 Bytes spart, wenn Vollbild-Fenster verwendet werden. Vielen Dank!

SmileBASIC 2, 52 51 Bytes

Diese läuft man in SmileBASIC Papas, Petit - Computer (und ist ein Zwei - Byte kürzer.)

PNLTYPE"OFF
GPAGE 1GCLS 15@A
GPSET TCHX,TCHY
GOTO@A

Erläuterung:

PNLTYPE"OFF       'turn off keyboard
GPAGE 1           'set graphics to lower screen
GCLS 15           'clear with color 15 (white)
@A                'loop begin
GPSET TCHX,TCHY   'set black pixel at draw location
GOTO@A            'loop

Javascript + jQuery 138 Bytes

d=$(document.body).click((e)=>d.append("<div style='background:black;width:5;height:5;position:fixed;top:"+e.pageY+";left:"+e.pageX+"'>"))

Probieren Sie es online aus!

Das Hinzufügen einer Klick- und Ziehunterstützung wäre einfach. Sie würden jedoch gemäß den Anweisungen eine Variable festlegen. Um den Code zu verkürzen, wird diese nicht unterstützt. . Ich habe die Anweisung als clickEreignis interpretiert .

SpecBAS - 61 59 Bytes

1 CLS 15 
2 IF MOUSEBTN=1 THEN PLOT MOUSEx,MOUSEy
3 GO TO 2

Schwarz ist bereits die Standardfarbe des Stifts, aber der Hintergrund ist normalerweise ein böser Grauton, sodass CLS 15er hellweiß wird.

SmileBASIC, 70 58 53 Bytes

XSCREEN 4GCLS-1@L
TOUCH OUT,X,Y
GPSET X,Y+240,0GOTO@L

Erklärt:

XSCREEN 4 'display one graphics page on both screens
GCLS -1 'fill screen with white
@L 'loop
TOUCH OUT,X,Y 'get touch location
GPSET X,Y+240,0 'draw black pixel at touch position, offset by the height of the top screen.
GOTO @L 'loop

Clojure, 91 71 Bytes

-20 Bytes Danke an @cfrick für den Hinweis, dass ich usemeinen Import verkleinern kann .

(use 'quil.core)(defsketch P :mouse-dragged #(point(mouse-x)(mouse-y)))

Verwendet die Quil- Bibliothek. Zeichnet einen Punkt, wenn die Maus gezogen wird.

Grundsätzlich ist die Verarbeitung die Antwort, da Quil ein Verarbeitungs-Wrapper für Clojure ist.

(q/defsketch P ; Start a new drawing

             :mouse-dragged ; Attach a mouse drag listener
             ; that draws a point at the current mouse location
             #(q/point (q/mouse-x) (q/mouse-y))) 

Tcl / Tk, 45, 46, 51, 57

gri [can .c]
bind . <1> {.c cr o %x %y %x %y}

Java 7, 353 Bytes

import java.awt.*;import java.awt.event.*;class M{static int x,y;public static void main(String[]a){Frame f=new Frame(){public void paint(Graphics g){g.drawLine(x,y,x,y);}};f.addMouseListener(new MouseAdapter(){public void mousePressed(MouseEvent e){x=e.getX();y=e.getY();f.repaint(x,y,1,1);}});f.setBackground(Color.WHITE);f.resize(500,500);f.show();}}

Ungolfed:

import java.awt.*;
import java.awt.event.*;

class M {
    //store the last point
    static int x, y;
    public static void main(String[] a) {
        Frame f = new Frame() {
            @Override
            public void paint(Graphics g) {
                g.drawLine(x, y, x, y);
            }
        }
        f.addMouseListener(new MouseAdapter() {
            @Override
            public void mousePressed(MouseEvent e) {
                x = e.getX();
                y = e.getY();
                //repaint only the "new pixel"
                f.repaint(x, y, 1, 1);
            }
        });
        //default background is grey
        f.setBackground(Color.WHITE);
        f.resize(500, 500);
        f.show();
    }
}

Python2 und Python3, 82 Bytes (oder 77?)

from turtle import *;up();onscreenclick(lambda x,y: goto(x,y)or dot(1));mainloop()

Mit dem Turtle-Modul ist das nicht schlecht :)

Ungolfed:

import turtle
turtle.up()

def fun(x, y):
    turtle.goto(x,y)
    turtle.dot(1)

turtle.onscreenclick(fun)
turtle.mainloop()

Wenn es in Ordnung ist, Linien zwischen den Punkten zu haben, können Sie tatsächlich 5 Bytes sparen:

from turtle import *;onscreenclick(lambda x,y: goto(x,y)or dot(1));mainloop()

Excel VBA, 62 Bytes

Anonyme VBE-Direktfensterfunktion, mit der der Benutzer auf jedem Blatt zeichnen kann, indem er es einfach auswählt

Cells.RowHeight=48:Do:DoEvents:Selection.Interior.Color=0:Loop

Beispielausgabe

HTML + Javascript, 152 148 Bytes

<body onclick="document.body.innerHTML+='<x style=position:fixed;width:1;height:1;left:'+event.clientX+';top:'+event.clientY+';background:#000;>'"/>

Turing , 77 Bytes

var x,y,b:int loop mousewhere(x,y,b)if b=1then drawdot(x,y,1)end if end loop

Ungolfed:

var x,y,b : int      
loop
  mousewhere(x,y,b)  % Set (x,y) to mouse co-ords, and b to 1 or 0 indicating if the button is pressed
  if b=1 then
    drawdot(x,y,1)  % Draw a black pixel at (x,y)
  end if
end loop

HTML + CSS + JavaScript (ES6), 8 + 31 + 64 = 103 Byte

Spaß mit CSS box-shadow!

s='0 0 0',onclick=e=>p.style.boxShadow=s+=`,${e.x}px ${e.y}px 0`

*{margin:0;width:1px;height:1px

<p id=p>

HTML + CSS + JavaScript (ES6), 8 + 22 + 69 = 99 Byte

In diesem Beispiel wird versucht, die Standardeinstellung margindes <body>Elements zu ändern, sie kann jedoch in den Browsern und Benutzeragenten-Stylesheets unterschiedlich sein. Erfolgreich in Chrome getestet.

s='0 0 0',onclick=e=>p.style.boxShadow=s+=`,${e.x-8}px ${e.y-16}px 0`

*{width:1px;height:1px

<p id=p>

HTML + CSS + JavaScript (ES6), 8 + 18 + 69 = 95 Byte

Pixel in diesem Bild erscheinen möglicherweise größer, da sie an halben Pixelkoordinaten gezeichnet sind.

s='0 0 0',onclick=e=>p.style.boxShadow=s+=`,${e.x}px ${e.y}px 0 .5px`

*{margin:0;width:0

<p id=p>

TI-Basic, 1 Byte

Pt-Change(

Ich bin sicher, dass die meisten von Ihnen mit TI Calcs an den PenBefehl gedacht haben , aber es stellt sich heraus, dass er nicht mit einem Token versehen ist, sodass es am sinnvollsten wäre, ihn als 3 Byte zu zählen. Informationen zur interaktiven Version von finden Sie Pt-Change(unter http://tibasicdev.wikidot.com/pt-change

Lua (love2d Framework), 180 Byte

Golf Version

l=love v,g,m,p=255,l.graphics,l.mouse,{}d=m.isDown function l.draw()g.setBackgroundColor(v,v,v)if d(1)or d(2)then p[#p+1],p[#p+2]=m.getPosition()end g.setColor(0,0,0)g.points(p)end

ungolfed

l=love 
v,g,m,p=255,l.graphics,l.mouse,{}
d=m.isDown 
function l.draw()
  g.setBackgroundColor(v,v,v)
  if d(1)or d(2)then 
    p[#p+1],p[#p+2]=m.getPosition()
  end 
  g.setColor(0,0,0)
  g.points(p)
end

ganz einfach wie es funktioniert. Zuerst ein paar Initialisierungen, um die Sache zu verkürzen. Danach wird überprüft, ob die Maus angeklickt ist, und die Punkte werden im Array gespeichert. Danach werden die Punkte gezeichnet. Außerdem wird die Farbe auf Weiß und Schwarz gesetzt, da die Standardeinstellung umgekehrt ist :)
Und hier kommt das Bild:

Verarbeitung, 65 Bytes

void draw(){if(mousePressed)line(mouseX,mouseY,pmouseX,pmouseY);}

glslsandbox 232 bytes

Alte Post fand das aber interessant.
Da die Verarbeitung bereits abgeschlossen ist, habe ich mich für etwas anderes entschieden.

Dies zeichnet, ob die Maus gedrückt ist oder nicht, also nicht, wonach pydude aber fast gefragt hat.

#ifdef GL_ES
precision lowp float;
#endif
uniform float time;uniform vec2 mouse,resolution;uniform sampler2D t;void main(){vec2 f=gl_FragCoord.xy,r=resolution;gl_FragColor=vec4(time<2.||length(f-mouse*r)>2.&&texture2D(t,f/r).x>.1);}

Probieren Sie es auf glslsandbox

Verarbeitung, 93 Byte, 91 Byte, wenn Leerzeichen nicht zählen

void setup(){size(100,100);background(-1);}void draw(){if(mousePressed) point(mouseX,mouseY);}

UCBlogo mit wxWidgets, 65 Bytes

setbg 7
setpc 0
ht
pu
make "buttonact[setpos clickpos pd fd 1 pu]

Erläuterung (der der Variablen zugewiesene Code buttonactwird bei jedem Tastenklick ausgeführt):

SetBackground 7 ; white
SetPenColor 0 ; black
HideTurtle
PenUp
make "buttonact [
  SetPos ClickPos
  PenDown
  Forward 1
  PenUp
]

Zumindest denke ich, dass dies funktioniert. Es sollte laut Dokumentation , aber anscheinend buttonactfunktioniert die Variable nur in einem wxWidgets-Build und ich habe Mühe, UCBLogo mit wxWidgets auf einem modernen Linux zu erstellen (waddyamean können Sie keinen Zeiger auf intund zurück setzen?).

UCBlogo ohne wxWidgets, 73 Bytes

Um den beabsichtigten Effekt zu sehen, können Sie diese längere Version mit einer Endlosschleife ausführen.

setbg 7 setpc 0 ht pu
while[1=1][setpos mousepos if[button?][pd] fd 1 pu]

Aber das stürzt ucblogoauf meiner Maschine ab ... Sieht aus wie ein Rennzustand.

UCBlogo, arbeitet tatsächlich auf meinem Computer, 80 Bytes

setbg 7 setpc 0 ht pu
while[1=1][setpos mousepos if[button?][pd] fd 1 pu wait 1]