拖放图像并在gridlayout上显示图像-Kivy

时间:2018-07-24 10:47:08

标签: python python-3.x kivy kivy-language

我是kivy的新手,我试图创建一个拖放应用程序,如果将图像拖放到gridlayout上,图像将显示在应用程序上,如下所示。我正在尝试获取图像的file_path,然后使用file_path将其显示在gridlayout上,但是不幸的是,这不起作用。任何帮助将不胜感激!

这是当前图片enter image description here

这是我拖动图像enter image description here

后想要的

Kv文件

# Custom button
<CustButton@Button>:
    font_size: 32
    background_normal: 'Colour_yellow.png'
    background_down: 'Colour_blue.png'

<Cust2@Button>:
    font_size: 32
    background_normal: 'Colour_red.png'
    background_down: 'Colour_blue.png'

<Cust3@Button>:
    font_size: 32
    background_normal: 'Colour_white.png'
    background_down: 'Colour_blue.png'

<Cust4@Button>:
    font_size: 32
    background_normal: 'Colour_blue.png'
    background_down: 'Colour_white.png'

<CalcGridLayout>:
    id: calculator
    display: entry
    rows: 5
    padding: 10
    spacing: 10

    BoxLayout:
        spacing: 100
        size_hint: .5, None
        Cust2:
            text: "Whats the intensity you want?"

    BoxLayout:

        size_hint: .5, None
        TextInput:
            id: entry
            font_size: 70
            multiline: False
            hint_text: "Type here"

    BoxLayout:
        spacing: 100
        size_hint: .5, None
        Cust4:
            text: "Drag and Drop picture below:"
            on_release: root.build1()

    #THIS IS WHERE I'M STUCK ON
    BoxLayout:
        Image:
            source: root._on_file_drop(file_path)

    BoxLayout:
        size_hint: 1, .3
        spacing: 10

        CustButton:
            text: "Click here for \n reduced size"

        CustButton:
            text: "Click here for pos \n  and intensity of \n      each pixel"
            on_release: root.reduced_image()

        CustButton:
            text: "Click here \n for graph"

        CustButton:
            text: "Click here \n     for all"

        CustButton:
            text: "Extra"

Python文件

import kivy

kivy.require("1.9.0")

from kivy.app import App
from kivy.uix.gridlayout import GridLayout
from kivy.core.window import Window
Window.clearcolor = (0.5, 0.5, 0.5, 1)


class CalcGridLayout(GridLayout):

    def reduced_image(self):
    #ignore

    def build1(self):
        Window.bind(on_dropfile=self._on_file_drop)
        return

    def _on_file_drop(self, window, file_path):
        print(file_path)
        return file_path



class dropdownApp(App):

    def build(self):
        return CalcGridLayout()


dropApp = dropdownApp()
dropApp.run()

1 个答案:

答案 0 :(得分:2)

解决方案

有关详细信息,请参阅代码段和完整示例。

kv文件

  1. 删除on_release: root.build1()
  2. source: root._on_file_drop(file_path)替换为id: img

摘要

BoxLayout:
    spacing: 100
    size_hint: .5, None
    Cust4:
        text: "Drag and Drop picture below:"

BoxLayout:
    Image:
        id: img

Python代码

  1. 添加导入语句from kivy.properties import StringProperty
  2. 声明属性,filePath = StringProperty('')中的class CalcGridLayout()
  3. 构造函数添加到class CalcGridLayout()并将Window.bind(on_dropfile=self._on_file_drop)build1()方法中移出
  4. 删除build1()方法
  5. _on_file_drop()方法中,将return file_path替换为self.filePath = file_path.decode("utf-8") self.ids.img.source = self.filePathself.ids.img.reload()

摘要

from kivy.properties import StringProperty
...

class CalcGridLayout(GridLayout):
    filePath = StringProperty('')

    def __init__(self, **kwargs):
        super(CalcGridLayout, self).__init__(**kwargs)
        Window.bind(on_dropfile=self._on_file_drop)

    def reduced_image(self):
        print(self.filePath)

    def _on_file_drop(self, window, file_path):
        print(file_path)
        self.filePath = file_path.decode("utf-8")     # convert byte to string
        self.ids.img.source = self.filePath
        self.ids.img.reload()   # reload image

Window » on_dropfile Event

on_dropfile(filename)
     

将文件拖放到应用程序上时调用的事件。

     

警告

     

此事件当前与pygame窗口上的sdl2窗口提供程序一起使用   提供程序和带有pygame修补版本的OSX。剩下的这个事件   可以进行进一步的开发(iOS,Android等)

示例

main.py

import kivy
kivy.require("1.11.0")

from kivy.app import App
from kivy.uix.gridlayout import GridLayout
from kivy.core.window import Window
from kivy.properties import StringProperty

Window.clearcolor = (0.5, 0.5, 0.5, 1)


class CalcGridLayout(GridLayout):
    filePath = StringProperty('')

    def __init__(self, **kwargs):
        super(CalcGridLayout, self).__init__(**kwargs)
        Window.bind(on_dropfile=self._on_file_drop)

    def reduced_image(self):
        print(self.filePath)

    def _on_file_drop(self, window, file_path):
        print(file_path)
        self.filePath = file_path.decode("utf-8")     # convert byte to string
        self.ids.img.source = self.filePath
        self.ids.img.reload()   # reload image


class DragDropApp(App):

    def build(self):
        return CalcGridLayout()


if __name__ == "__main__":
    DragDropApp().run()

dragdrop.kv

#:kivy 1.11.0

# Custom button
<CustButton@Button>:
    background_normal: "/home/iam/Pictures/AppImages/Colors/yellow.png"   # 'Colour_yellow.png'
    background_down: "/home/iam/Pictures/AppImages/Colors/blue.png"       # 'Colour_blue.png'
    text_size: self.size
    halign: 'center'
    valign: 'middle'

<Cust2@Button>:
    font_size: 32
    background_normal: "/home/iam/Pictures/AppImages/Colors/red.png"   # 'Colour_red.png'
    background_down: "/home/iam/Pictures/AppImages/Colors/blue.png"     # 'Colour_blue.png'

<Cust3@Button>:
    font_size: 32
    background_normal: "/home/iam/Pictures/AppImages/Colors/white.png"     # 'Colour_white.png'
    background_down: "/home/iam/Pictures/AppImages/Colors/blue.png"       # 'Colour_blue.png'

<Cust4@Button>:
    font_size: 32
    background_normal: "/home/iam/Pictures/AppImages/Colors/blue.png"     # 'Colour_blue.png'
    background_down: "/home/iam/Pictures/AppImages/Colors/white.png"       # 'Colour_white.png'

<CalcGridLayout>:
    id: calculator
    display: entry
    rows: 5
    padding: 10
    spacing: 10

    BoxLayout:
        spacing: 100
        size_hint: .5, None
        Cust2:
            text: "Whats the intensity you want?"

    BoxLayout:
        size_hint: .5, None
        TextInput:
            id: entry
            font_size: 70
            multiline: False
            hint_text: "Type here"

    BoxLayout:
        spacing: 100
        size_hint: .5, None
        Cust4:
            text: "Drag and Drop picture below:"

    BoxLayout:
        Image:
            id: img

    BoxLayout:
        size_hint: 1, .3
        spacing: 10

        CustButton:
            text: "Click here for \n reduced size"

        CustButton:
            text: "Click here for pos \n  and intensity of \n      each pixel"
            on_release: root.reduced_image()

        CustButton:
            text: "Click here \n for graph"

        CustButton:
            text: "Click here \n     for all"

        CustButton:
            text: "Extra"

输出

Img01 Img02