Forum Archive

Need help with a Photo Gallery

TutorialDoctor

Trying to go for a photo gallery in Pythonista that loads images for camera roll into a scroll view.

The project is hosted here

The readme states what features it will have.

The main issue I am having is how to layout the image views. I have several tests trying to work in the logic for it.

Any suggestions?

brumm

You have to do several calculation. I would start with the size of each photo (e.g. 300x200) plus frame (eg. 20) = (340x240). Then make a grid (e.g. 3 rows and 3 columns => (1020x720 scrollview content). Next thing to take care is the scale factor (scene.get_screen_scale() + scale of your photo to fit in the 340x240 // 300x200 place with an offset of 20x20).

Here you can find some examples:
PhotoTextV2 => photo in scrollview with screen-scale
MyImageView.py => howto resize a picture

TutorialDoctor

Thank you very much for the feedback. Nice approach.

brumm

As a start...

# coding: utf-8

import ui, photos

class MyPictureView(ui.View):
    def __init__(self, width, height):
        self.frame = (0,0,width,height)
        self.iwidth = 300
        self.iheight = 200
        framesize = 10
        self.img = ui.Image.from_data(photos.pick_image(raw_data=True))
        #w, h = self.img.size
        #print 'img size: ' + str(w) + ' x ' + str(h)
        with ui.ImageContext(self.iwidth, self.iheight) as ctx:
            self.img.draw(framesize,framesize,self.iwidth-2*framesize,self.iheight-2*framesize)
            self.img = ctx.get_image()

    def draw(self):
        x = 0
        y = 0
        self.img.draw(x,y,self.iwidth,self.iheight)

        x = self.iwidth
        self.img.draw(x,y,self.iwidth,self.iheight)

        x = 2 * self.iwidth
        self.img.draw(x,y,self.iwidth,self.iheight)

        x = 0
        y = self.iheight
        self.img.draw(x,y,self.iwidth,self.iheight)

        y = 2 * self.iheight
        self.img.draw(x,y,self.iwidth,self.iheight)

        y = 3 * self.iheight
        self.img.draw(x,y,self.iwidth,self.iheight)

    def layout(self):
        pass

    def touch_began(self, touch):
        pass

class MiniPhotoView(ui.View):
    def __init__(self):
        self.view = ui.View(background_color='lightyellow')
        self.view.name = 'MiniPhotoView'
        scrollview1 = ui.ScrollView()
        scrollview1.name = 'scrollview1'
        scrollview1.flex = 'WH'
        scrollview1.content_size = (2000,2000)
        self.view.add_subview(scrollview1)
        self.view.present('full_screen')
        self.sv1 = self.view['scrollview1']
        width, height = self.sv1.content_size
        self.sv1.add_subview(MyPictureView(width,height))

if photos.get_count():
    MiniPhotoView()
else:
    print('Sorry no access or no pictures.')
brumm

...couldn't resist.
MiniPhotoView