multithreading - wxpython线程在加载图像时显示图像

Question

我正在编写一个GUI，以显示已定义的URL列表中的一些图像(亚马逊的书籍封面)，我已经能够成功地将它们加载到面板中，但是尽管使用了线程，但GUI似乎要等到所有循环结束，然后立即显示所有图像，我如何才能使GUI在获取运行时显示每个图像。.GUI基本上是冻结的，直到获取图像为止...谢谢!

再次的问题是，确保在拉动而不是一次全部显示时，我可以在GUI上显示每个图像...

import wx
import os
import sys
import urllib2
import cStringIO
import threading
import time

urls = ['https://images-na.ssl-images-amazon.com/images/I/51-u3J3mtTL._AC_US100_.jpg',
        'https://images-na.ssl-images-amazon.com/images/I/51cRqX8DTgL._AC_US100_.jpg',
        'https://images-na.ssl-images-amazon.com/images/I/515iBchIIzL._AC_US100_.jpg',
        'https://images-na.ssl-images-amazon.com/images/I/511MaP7GeJL._AC_US100_.jpg',
        'https://images-na.ssl-images-amazon.com/images/I/51jizRmRYYL._AC_US160_.jpg',
    'https://images-na.ssl-images-amazon.com/images/I/51jizRmRYYL._AC_US160_.jpg',
    'https://images-na.ssl-images-amazon.com/images/I/31Pw7voGDFL._AC_US160_.jpg',
    'https://images-na.ssl-images-amazon.com/images/I/51g30m1xpPL._AC_US160_.jpg',
    'https://images-na.ssl-images-amazon.com/images/I/51qx+6aQUnL._AC_US160_.jpg']

class Example(wx.Frame):

    def __init__(self, *args, **kwargs):
        super(Example, self).__init__(*args, **kwargs) 
        self.InitUI()
        self.Ctrls()
        self.makeButtons()

    def makeButtons(self):

        def _update_data(data):
            time.sleep(2)
            stream = cStringIO.StringIO(data)
            bmp = wx.BitmapFromImage( wx.ImageFromStream( stream ) )
            button = wx.Button(self.panel, -1, "Book cover", style=wx.ALIGN_CENTER, size=wx.Size(100,100))
            button.SetToolTipString("wx.Button can how have an icon on the left, right,\n"
                           "above or below the label.")
            button.SetBitmap(bmp,
                    wx.LEFT    # Left is the default, the image can be on the other sides too
                    #wx.RIGHT
                    #wx.TOP
                    #wx.BOTTOM
                    )
            button.SetBitmapMargins((4,4)) 
            button.SetFont(wx.Font(8, wx.SWISS, wx.NORMAL, wx.BOLD, False))
            self.wrapSizer.Add(button, 1, wx.EXPAND)
            self.Show(True)
            self.panel.Layout()

        def f():
            f = urllib2.urlopen(url)
            data = f.read()
            wx.CallAfter(_update_data, data)

        for url in urls:
            threading.Thread(target=f).start()

    def InitUI(self):
        self.SetSize((800, 400))
        self.SetTitle('Dynamically Flow Buttons to Next Row on Window-Resize')
        self.Centre()


    def Sizers(self):
        self.wrapSizer = wx.WrapSizer()
        self.panel.SetSizer(self.wrapSizer)

    def Ctrls(self):
        self.panel = wx.Panel(parent=self,pos=wx.Point(0,0), size=wx.Size(750,550), style=wx.TAB_TRAVERSAL)
        self.Sizers()

def main():

    ex = wx.App()
    Example(None)
    ex.MainLoop()

if __name__ == '__main__':
    main()

Answer 1

如问题代码示例中所尝试的，也有可能立即剥离所有线程。原始代码中的问题是，由于在处理位图请求时存在时间延迟，因此GUI处于阻塞状态。

请记住，在下面的示例中，位图的顺序将取决于线程完成的顺序(在这种情况下，顺序是随机的)。

import wx
import urllib2
import cStringIO
import threading
import time
from random import random

urls = ['https://images-na.ssl-images-amazon.com/images/I/51-u3J3mtTL._AC_US100_.jpg',
        'https://images-na.ssl-images-amazon.com/images/I/51cRqX8DTgL._AC_US100_.jpg',
        'https://images-na.ssl-images-amazon.com/images/I/515iBchIIzL._AC_US100_.jpg',
        'https://images-na.ssl-images-amazon.com/images/I/511MaP7GeJL._AC_US100_.jpg',
        'https://images-na.ssl-images-amazon.com/images/I/51jizRmRYYL._AC_US160_.jpg',
    'https://images-na.ssl-images-amazon.com/images/I/51jizRmRYYL._AC_US160_.jpg',
    'https://images-na.ssl-images-amazon.com/images/I/31Pw7voGDFL._AC_US160_.jpg',
    'https://images-na.ssl-images-amazon.com/images/I/51g30m1xpPL._AC_US160_.jpg',
    'https://images-na.ssl-images-amazon.com/images/I/51qx+6aQUnL._AC_US160_.jpg']

def url2bmp(url, callback):
    f = urllib2.urlopen(url)
    data = f.read()

    # to simulate random read delay
    time.sleep(2 * random())

    stream = cStringIO.StringIO(data)
    bmp = wx.BitmapFromImage(wx.ImageFromStream(stream))
    wx.CallAfter(callback, bmp)

class Example(wx.Frame):

    def __init__(self, *args, **kwargs):
        super(Example, self).__init__(*args, **kwargs) 
        self.InitUI()
        self.Ctrls()
        self.Show(True)
        self.makeButtons()

    def makeButtons(self):
        for url in urls:
            threading.Thread(target=url2bmp, args=(url, self.update_ui)).start()

    def update_ui(self, bmp):
        button = wx.Button(self.panel, -1, "Book cover", style=wx.ALIGN_CENTER, size=wx.Size(100,100))
        button.SetToolTipString("wx.Button can how have an icon on the left, right,\n"
                       "above or below the label.")
        button.SetBitmap(bmp,
                wx.LEFT    # Left is the default, the image can be on the other sides too
                #wx.RIGHT
                #wx.TOP
                #wx.BOTTOM
                )
        self.wrapSizer.Add(button, 1, wx.EXPAND)
        self.panel.Layout()

    def InitUI(self):
        self.SetSize((800, 400))
        self.SetTitle('Dynamically Flow Buttons to Next Row on Window-Resize')
        self.Centre()

    def Sizers(self):
        self.wrapSizer = wx.WrapSizer()
        self.panel.SetSizer(self.wrapSizer)

    def Ctrls(self):
        self.panel = wx.Panel(parent=self,pos=wx.Point(0,0), size=wx.Size(750,550), style=wx.TAB_TRAVERSAL)
        self.Sizers()

def main():

    ex = wx.App()
    Example(None)
    ex.MainLoop()

if __name__ == '__main__':
    main()

编辑:重新编写示例以首先生成空按钮，然后在位图到达时立即应用它们。现在比较丑，现在应该重构一个比使用标签更安全的 url映射按钮。

import wx
import urllib2
import cStringIO
import threading
import time
from random import random

urls = ['https://images-na.ssl-images-amazon.com/images/I/51-u3J3mtTL._AC_US100_.jpg',
        'https://images-na.ssl-images-amazon.com/images/I/51cRqX8DTgL._AC_US100_.jpg',
        'https://images-na.ssl-images-amazon.com/images/I/515iBchIIzL._AC_US100_.jpg',
        'https://images-na.ssl-images-amazon.com/images/I/511MaP7GeJL._AC_US100_.jpg',
        'https://images-na.ssl-images-amazon.com/images/I/51jizRmRYYL._AC_US160_.jpg',
    'https://images-na.ssl-images-amazon.com/images/I/51jizRmRYYL._AC_US160_.jpg',
    'https://images-na.ssl-images-amazon.com/images/I/31Pw7voGDFL._AC_US160_.jpg',
    'https://images-na.ssl-images-amazon.com/images/I/51g30m1xpPL._AC_US160_.jpg',
    'https://images-na.ssl-images-amazon.com/images/I/51qx+6aQUnL._AC_US160_.jpg']

def url2bmp(url, callback):
    f = urllib2.urlopen(url)
    data = f.read()

    # to simulate random read delay
    time.sleep(2 * random())

    stream = cStringIO.StringIO(data)
    bmp = wx.BitmapFromImage(wx.ImageFromStream(stream))
    wx.CallAfter(callback, url, bmp)

class Example(wx.Frame):

    def __init__(self, *args, **kwargs):
        super(Example, self).__init__(*args, **kwargs) 
        self.InitUI()
        self.Ctrls()
        self.Show(True)
        self.makeButtons()

    def makeButtons(self):
        for url in urls:
            self.update_ui(url)
            threading.Thread(target=url2bmp, args=(url, self.update_ui)).start()

    def update_ui(self, url, bmp=None):
        if bmp is None:
            # create button, but not bitmap
            button = wx.Button(self.panel, -1, url, style=wx.ALIGN_CENTER, size=wx.Size(100,100))
            button.SetToolTipString("wx.Button can how have an icon on the left, right,\n"
                           "above or below the label.")
            self.wrapSizer.Add(button, 1, wx.EXPAND)
        else:
            children = self.wrapSizer.GetChildren()
            # http://www.blog.pythonlibrary.org/2012/08/24/wxpython-how-to-get-children-widgets-from-a-sizer/
            for widget in children:
                button = widget.GetWindow()
                if isinstance(button, wx.Button):
                    if button.GetLabel() == url:
                        button.SetBitmap(bmp,
                                wx.LEFT    # Left is the default, the image can be on the other sides too
                                #wx.RIGHT
                                #wx.TOP
                                #wx.BOTTOM
                                )
                        button.SetLabel('')
        self.panel.Layout()

    def InitUI(self):
        self.SetSize((800, 400))
        self.SetTitle('Dynamically Flow Buttons to Next Row on Window-Resize')
        self.Centre()

    def Sizers(self):
        self.wrapSizer = wx.WrapSizer()
        self.panel.SetSizer(self.wrapSizer)

    def Ctrls(self):
        self.panel = wx.Panel(parent=self,pos=wx.Point(0,0), size=wx.Size(750,550), style=wx.TAB_TRAVERSAL)
        self.Sizers()

def main():

    ex = wx.App()
    Example(None)
    ex.MainLoop()

if __name__ == '__main__':
    main()