Forum Archive

Hi guys,
I have a ui.TableView which I fill with data including section headers. in the documentation it shows there's a "built in" image view attribute accessible via ui.TableViewCell.image_view but it's listed as "read-only" which is the error it gives when I try to add a ui image to it. How would one add a ui image to the built in image view of TableViewCell???

[Solved: use ui.TableViewCell.image_view.image=]

import ui
#import openSecretsEndpoints
import dialogs
import imageStuff

class MyTableViewDelegate (object):
    @ui.in_background
    def tableview_did_select(self, tableview, section, row):
        # Called when a row IS selected.
        print('printing...did select')

        handleKeys = self.data.keys()
        handleKeySection = self.data.keys()[section]    
        handleAvatarURL = self.data[self.data.keys()[section]][1]
        handleRelevantTweets = self.data[self.data.keys()[section]][0]
        handleRowTweet = self.data[self.data.keys()[section]][0][row]

        dialogs.alert(str(self.data[self.data.keys()[section]][0][row]))

class MyTableViewDataSource (object):
    def tableview_number_of_sections(self,tableview):
        return len(self.data)

    def tableview_title_for_header(self,tableview,section):
        #return self.data.keys()[section]
        #return "Twitter Handles"
        return self.data.keys()[section]

    def tableview_number_of_rows(self,tableview,section):
        key = self.data.keys()[section]
        return len(self.data[key][0])

    def tableview_cell_for_row(self, tableview, section, row):
        # Create and return a cell for the given section/row

        key = self.data.keys()[section]
        cell = ui.TableViewCell()

        cell.autoresizing ='auto'
        cell.size_to_fit()
        cell.height=50

        cell.text_label.text = self.data[self.data.keys()[section]][0][row]

        #cell.content_view.add_subview()
        #cell.image_view = imageStuff.circleMaskViewFromURL(self.data[self.data.keys()[section]][1])

                #ALSO TRIED THIS:
                 cell.imageView = ui.ImageView()
                 cell.imageView.image = imageStuff.circleMaskViewFromURL(self.data[self.data.keys()[section]][1])
                 cell.imageView.present()

        return cell

    def fill_data(self, tableview, data):

        self.data = data


#dataSource = openSecretsEndpoints.Candidacy().getCandidateList()
dataSource = {u'RepTimMurphy': ([u"I'm next @FoxBusiness @TeamCavuto discussing @HouseCommerce request 4 #FBI #Apple 2 appear on future of #encryption https://t.co/ZfJyV2iooe"], u'http://pbs.twimg.com/profile_images/378800000252739465/67e48a9fc07ce37c132d93cc9e4c6874_normal.jpeg'), u'RepMeehan': ([u"There's too much at stake for a standoff between Apple and the FBI. https://t.co/tke9NwSxyn <--- my view on in today's @PhillyInquirer", u"In today's @PhillyInquirer: my views on the ongoing debate regarding #Apple, the #FBI and encryption: https://t.co/EIAJsB9LXQ"], u'http://pbs.twimg.com/profile_images/1388714447/MPF11_031_506_normal.jpg'), u'RepTomMarino': ([u'RT @HouseJudiciary: Apple, FBI to face off at House hearing on encryption https://t.co/xNOB3rsH37 via @USATODAY'], u'http://pbs.twimg.com/profile_images/704700495730974720/4K03J5FW_normal.jpg')}

table = dataSource[1]

OTVD = ui.TableView()
data = MyTableViewDataSource()
OTVD.delegate = MyTableViewDelegate()
OTVD.row_height = 50

OTVD.data_source = data
print(data)
print len(table)


if len(table) >=1:
    data.fill_data(OTVD, table)

    OTVD.delegate.data = data.data

    OTVD.present()

Just so it could be run....
here is imageStuff.py

import ui
import webbrowser
from PIL import Image, ImageOps, ImageDraw
import io
import Image

try:
    import cStringIO
    import urllib2
except ImportError:
    from io import StringIO as cStringIO
    import urllib3 as urllib2


def circleMaskViewFromURL(url):
    url=url
    #load image from url and show it
    file=cStringIO.StringIO(urllib2.urlopen(url).read())

    img = Image.open(file)

    #begin mask creation
    bigsize = (img.size[0] * 3, img.size[1] * 3)
    mask = Image.new('L', bigsize, 0)
    draw = ImageDraw.Draw(mask) 
    draw.ellipse((0, 0) + bigsize, fill=255)
    mask = mask.resize(img.size, Image.ANTIALIAS)

    img.putalpha(mask)

    #show final masked image
    img.show()
    img=pil2ui(img)

    return img

# pil <=> ui
def pil2ui(imgIn):
    with io.BytesIO() as bIO:
        imgIn.save(bIO, 'PNG')
        imgOut = ui.Image.from_data(bIO.getvalue())
    del bIO
    return imgOut

Have you tried to load the image via ui.ListDataSource? This works at least for stored images. link

i haven't tired this but un-comment the following line and change it and see how it goes?

cell.image_view = imageStuff.circleMaskViewFromURL(self.data[self.data.keys()[section]][1])

cell.image_view.image = imageStuff.circleMaskViewFromURL(self.data[self.data.keys()[section]][1])

Thanks for the example and I'll be looking into it to see how I can adapt it for my purposes - I do wish I could load images dynamically without having to write to disk. @brumm

@shaun-h I could have sworn I already tried that!!! but I guess not. IT DID THE TRICK. thanks.

I'd prefer not to save images to disk, but can anybody here speak to any reason why dynamically loading images into code would be bad? memory usage etc?

maybe i missed it, but you don't need to load images from a file. you can create a ui.Image from an image context, you can use from_data, etc.

Take a look at how ListDataSource works in ui.py

            if isinstance(img, basestring):
                cell.image_view.image = Image.named(img)
            elif isinstance(img, Image):
                cell.image_view.image = img

while the image_view is read only, the image attribute is writable.