2011-04-07 13 views
6

He tomado fotos de paso para aprender El Cairo en el pasado, pero siempre he avanzado a favor de alguna otra biblioteca de gráficos. Mi problema es que no puedo encontrar un buen tutorial que me brinde una pantalla simple para mi superficie. Siempre terminé hurgando en la documentación de GTK o QT sobre cosas que no tienen nada que ver con lo que quiero hacer. Quiero aprender El Cairo, no una arquitectura OO masiva.La manera más rápida de empezar con cairo

¿Qué es una envoltura básica para darme una ventana multiplataforma con un lienzo de El Cairo para dibujar?

Respuesta

10

He utilizado el Cairo para prácticamente cualquier cosa relacionada con el dibujo. Trabajo en una empresa de software médico, por lo que prototipo de visualización de datos científicos y otras cosas.

que tienen por lo general tres formas de mostrar mis dibujos:

  1. un área de dibujo GTK creado con un script en Python y GTK;
  2. Una imagen PNG mostrada directamente en la pantalla usando la biblioteca de imágenes de Python show() método;
  3. Imagen PNG guardada en el disco, también a través de la Biblioteca de imágenes de Python.

un simple script derivado de ejemplos cairographics, lo que en realidad yo uso como un modelo para cualquier nuevo proyecto, es:

import gtk 

class Canvas(gtk.DrawingArea): 
    def __init__(self): 
     super(Canvas, self).__init__() 
     self.connect("expose_event", self.expose) 
     self.set_size_request(800,500) 

    def expose(self, widget, event): 
     cr = widget.window.cairo_create() 
     rect = self.get_allocation() 

     # you can use w and h to calculate relative positions which 
     # also change dynamically if window gets resized 
     w = rect.width 
     h = rect.height 

     # here is the part where you actually draw 
     cr.move_to(0,0) 
     cr.line_to(w/2, h/2) 
     cr.stroke() 

window = gtk.Window() 
canvas = Canvas() 
window.add(canvas) 
window.set_position(gtk.WIN_POS_CENTER) 
window.show_all() 
gtk.main() 

O, si lo prefiere no tratar con herramientas GUI, puede crear y mostrar una imagen en la pantalla, y opcionalmente guardarlo en el archivo:

import cairo, Image 

width = 800 
height = 600 

surface = cairo.ImageSurface(cairo.FORMAT_ARGB32, width, height) 
cr = cairo.Context(surface) 

# optional conversion from screen to cartesian coordinates: 
cr.translate(0, height) 
cr.scale(1, -1) 

# something very similar to Japanese flag: 
cr.set_source_rgb(1,1,1) 
cr.rectangle(0, 0, width, height) 
cr.fill() 
cr.arc(width/2, height/2, 150, 0, 6.28) 
cr.set_source_rgb(1,0,0) 
cr.fill() 

im = Image.frombuffer("RGBA", 
         (width, height), 
         surface.get_data(), 
         "raw", 
         "BGRA", 
         0,1) # don't ask me what these are! 
im.show() 
# im.save('filename', 'png') 
+0

Gracias por esto. Acabo de pasar por una tonelada de aros para que esto funcione (incluido el proceso de instalación completamente roto para PIL en OS X). Me temo que esto es completamente inadecuado para usuarios principiantes. (Tampoco debería ser: de PIL import Image?) – Alper

+0

Ese tipo de cosas me hicieron cambiar a soluciones basadas en navegador (HTML Canvas o SVG basado en Javascript), y también Processing para dibujos rápidos y sucios. Pero el hecho es que El Cairo todavía es mucho más poderoso que cualquier otra solución hasta ahora: D. – heltonbiker

+0

También: python es una forma mucho más decente de hacer esto que sangriento javascript. – Alper

1

Una respuesta a related question muestra una configuración muy simple en Gtk2HS para dibujar en un drawingArea con Cairo.

import Graphics.UI.Gtk 
import Graphics.Rendering.Cairo 

main :: IO() 
main = do 
    initGUI 
    window  <- windowNew 
    drawingArea <- drawingAreaNew 
    containerAdd window drawingArea 

    drawingArea `onExpose` (\_ -> renderScene drawingArea) 
    window `onDestroy` mainQuit 

    windowSetDefaultSize window 640 480 
    widgetShowAll window 
    mainGUI 

renderScene :: DrawingArea -> IO Bool 
renderScene da = do 
    dw <- widgetGetDrawWindow da 
    renderWithDrawable dw $ do setSourceRGBA 0.5 0.5 0.5 1.0 
           moveTo 100.0 100.0 
           showText "HelloWorld" 

    return True 

simplemente pasan a su rutina de animación El Cairo para renderWithDrawable dw en renderScene.

Cuestiones relacionadas