垂直对齐 wxpanel 中心的图像和按钮的最简单方法是什么？

问题描述

我的项目是 YouTube，主页包含您可以观看的视频。视频由缩略图和“播放”下方的按钮组成。我想要一个像这样制作的 wxpython 面板...... \图像\ 按钮 \图像\ 按钮等等

屏幕顶部的图像水平放置在中央，下方有一个按钮。然后在第一个视频的按钮下方，一个图像，然后是一个按钮，依此类推。

我尝试查看 sizer，我想解决方案将包含 sizer，但我很难理解它的工作原理以及如何使用它来解决我的问题。

这是我目前所拥有的（将第一张图像水平放置在中心）

    self.image = wx.StaticBitmap(self)
    self.image.SetBitmap(wx.Bitmap('icon.png'))
    self.topsizer = wx.BoxSizer(wx.HORIZONTAL)
    self.topsizer.Add(self.image,wx.ALIGN_CENTER_HORIZONTAL)
    self.SetSizer(self.topsizer)
    self.Layout()

解决方法

要记住的是，人们不能只是share 编码，除非他们正在做您想做的事情。必须写。
尝试以此为起点。
图像重新缩放特定于我的图像，以使其大小合适。

import wx 
from wx.lib.scrolledpanel import ScrolledPanel

imgs = ['ace.png','2.png','3.png','4.png','5.png']
links = ['https://www.asite.com/ace.mp4','https://www.asite.com/2.mp4','https://www.asite.com/3.mp4','https://www.asite.com/4.mp4','https://www.asite.com/5.mp4']

class Example(wx.Frame): 
   
    def __init__(self,parent,title): 
        super(Example,self).__init__(parent,title = title) 
             
        self.InitUI() 
        self.Centre() 
        self.Show()
        
    def InitUI(self): 
        panel = ScrolledPanel(self,wx.ID_ANY)
        panel.SetupScrolling()
        vbox = wx.BoxSizer(wx.VERTICAL) 

        for index,img in enumerate(imgs):
            bmp = wx.Bitmap(img)
            image = bmp.ConvertToImage()
            image.Rescale(70,100)
            bmp = wx.Bitmap(image)
            video = wx.StaticBitmap(panel,wx.ID_ANY,bmp)
            button = wx.Button(panel,"Play",name=str(index))
            button.SetToolTip("Play "+links[index])
            vbox.Add(video,wx.ALL|wx.ALIGN_CENTER_HORIZONTAL,0) 
            vbox.Add(button,5) 
            self.Bind(wx.EVT_BUTTON,self.OnPlay,button)
 
        panel.SetSizer(vbox) 

    def OnPlay(self,event): 
        obj = event.GetEventObject()        
        print("Playing ..."+links[int(obj.GetName())])
                  
app = wx.App() 
Example(None,title = 'BoxSizer Demonstration') 
app.MainLoop()

python sizer