每次按下按钮时如何在屏幕上向上移动文本

时间:2019-04-16 17:46:22

标签: kivy

我想为Android开发一个聊天应用程序。它将从站点上的控制器接收消息。为此,我已经开始设计GUI。在练习和研究了一些代码之后,我已经能够设计一个文本框,一个按钮和一个标签。当按下按钮时,文本框中的文本将显示在名为“ Display”的标签上,并且文本框将被清除。但是,现在我希望每次单击按钮时,文本应向上移动,并且其空间应替换为文本框中的文本。同样,来自发送方的文本应显示在屏幕的右侧,收到的文本应显示在屏幕的左侧。这可能是一个愚蠢的问题,但是由于我对python和kivy完全陌生,因此在尝试了一周以上之后,对我而言变得越来越困难。请指导我。下面是代码。 这是main.py

import kivy
from kivy.app import App
from kivy.uix.button import Button
from kivy.uix.gridlayout import GridLayout
from kivy.uix.floatlayout import FloatLayout
from kivy.properties import StringProperty
from kivy.uix.scrollview import ScrollView

class scrollableLabel(FloatLayout):
    def display_txt(self):
        self.ids.lbl.text = self.ids.txt.text
        self.ids.txt.text = ''

class MyApp(App):
    def build(self):
        return scrollableLabel()

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

这是猕猴桃文件

<scrollableLabel>:
    FloatLayout:
    cols : 1
    rows : 3
    Button:
        text : 'Send'
        size_hint : .2 , .1
        pos : 640 , 0
        on_press : root.display_txt()

    TextInput:
        hint_text : 'Write here'
        id : txt
        size_hint : .8 , .1
        pos : 0 ,0

    Label :
        id : lbl
        text : 'Display'
        size_hint : .5 , .4
        pos : 500 , 100
        text_size : self.size

2 个答案:

答案 0 :(得分:2)

聊天应用-建议

Kivy Label » Text alignment and wrapping

  • 声明一个继承自Label小部件的自定义小部件,以便您可以控制文本对齐方式,即,左侧为发送的文本,右侧为接收的文本。

摘要-kv文件

<CustomLabel@Label>:
    size_hint_y: None
    text_size: self.width, None
    height: self.texture_size[1]
    halign: 'left'
    valign: 'middle'

Kivy RecycleView

  • Label:替换为RecycleView:
  • CustomLabel用作viewclass
  • 将已发送的文本或已接收的文本追加到RecycleView的data

摘要-kv文件

RecycleView:
    id: rv
    viewclass: 'CustomLabel'

    RecycleBoxLayout:
        default_size_hint: 1, None
        orientation: 'vertical'

Kivy RecycleView » data

  

通过处理数据生成视图,本质上是   dict,并使用这些dict生成viewclass的实例,如下所示:   必填。

data
     

当前视图适配器使用的数据。这是字典列表   其键映射到对应的属性名称   viewclass

     

data是AliasProperty,用于获取并设置用于   生成视图。

摘要-Py文件

    def display_txt(self):
        self.ids.rv.data.append({'text': self.ids.txt.text, 'halign': 'left'})
        self.ids.txt.text = ''

示例

main.py

from kivy.app import App
from kivy.uix.screenmanager import Screen
from kivy.lang import Builder


class SMS(Screen):
    def send_txt(self):
        self.ids.rv.data.append({'text': self.ids.txt.text, 'halign': 'left'})
        self.ids.txt.text = ''

    def receive_txt(self):
        self.ids.rv.data.append({'text': self.ids.txt.text, 'halign': 'right'})
        self.ids.txt.text = ''


Builder.load_file("main.kv")


class MyApp(App):
    def build(self):
        return SMS()


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

main.kv

<ChatBox@Label>:
    size_hint_y: None
    text_size: self.width, None
    height: self.texture_size[1]
    halign: 'left'
    valign: 'middle'

<SMS>:
    GridLayout:
        cols : 1

        BoxLayout:
            size_hint: 1, 0.1
            Button:
                text : 'Send'
                on_press : root.send_txt()
            Button:
                text : 'Receive'
                on_press : root.receive_txt()

        TextInput:
            hint_text : 'Write here'
            id : txt
            size_hint : .8 , .1
            pos : 0 ,0

        RecycleView:
            id: rv
            viewclass: 'ChatBox'

            RecycleBoxLayout:
                default_size_hint: 1, None
                orientation: 'vertical'

输出

Result

答案 1 :(得分:0)

我试图稍微改变外观。我想要在底部发送和接收按钮以及输入文本,并在其顶部添加标签。并发现文本从文本输入框和按钮上方的某个高度开始显示。我需要立即将其显示在按钮和文本输入框的正上方。在我的代码中,发送和接收按钮的文本都显示在左侧。请告诉我为什么。
这是.kv文件
         :               size_hint_x:无               size_hint_y:无               位置:0,0               text_size:self.width,无               高度:self.texture_size [1]               halign:“左”               valign:“中间”

     <CustomButton@Button>:
          font_size : 25
          size_hint : 0.1,0.1

     <MyWidget>:
          GridLayout:
              #size : root.width, root.height
              #orientation : 'horizontal'
              #pos:100,100
              cols:1
              row:3

              RecycleView:
                  id: rv
                  viewclass: 'ChatBox'

                  RecycleBoxLayout:
                      default_size_hint: 1, None
                      orientation: 'vertical'

              BoxLayout:
                  TextInput:
                      hint_text: 'type here'
                      id : txt
                      multiline : True
                      size_hint : .5,.1
                      #pos : 0,0
                  CustomButton:
                      text: 'Receive'
                      on_press : root.send_txt()
                      #pos : 10,0
                  CustomButton:
                      text: 'Send'
                      on_press : root.send_txt()
                      #pos : 20,0    

除此之外,当屏幕上充满文本并完全向上移动时,所有文本都会消失,并且如果我们再次发送或接收新文本,则该文本不会出现在屏幕上。主席先生,请告诉我如何解决这个问题。 谢谢。