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

Question

我想为android开发一个聊天应用程序。它将从站点上的控制器接收消息。为此，我开始设计GUI。在练习和学习几个代码之后，我已经能够设计一个文本框，一个按钮和一个标签。按下按钮时，文本框中的文本将显示在名为“显示”的标签上，文本框将被清除。但是现在我希望每次单击按钮时文本应该向上移动，它的空间应该替换为文本框中的文本。同样，发件人的文字应显示在右侧，收到的文字应显示在屏幕的左侧。这可能是一个愚蠢的问题，但因为我对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()

这是kivy文件

<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

Answer 1

Chat App - Suggestion

Kivy Label » Text alignment and wrapping

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

Snippets - kv file

<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

Snippets - kv file

RecycleView:
    id: rv
    viewclass: 'CustomLabel'

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

Kivy RecycleView » data

该视图通过处理数据（基本上是一个dicts列表）来生成，并使用这些dicts根据需要生成视图类的实例。

data

当前视图适配器使用的数据。这是一个dicts列表，其键映射到viewclass的相应属性名称。

data是一个AliasProperty，用于获取和设置用于生成视图的数据。

Snippets - Py file

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

Example

卖弄.朋友

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'

Output

Answer 2

我试着改变一下外观。我想在底部发送，接收按钮和textinput，并在其顶部标记。并发现文本从文本输入框和按钮上方的某个高度开始显示。我需要它立即显示在按钮和文本输入框的正上方。在我的代码中，发送和接收按钮的文本都显示在左侧。请告诉我为什么会这样。 这是.kv文件 ：size_hint_x：无size_hint_y：无pos：0,0 text_size：self.width，无高度：self.texture_size [1] halign：'left'valign：'middle'

     <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    

除此之外，当屏幕被文本填满并完全向上移动时，所有文本都会消失，如果我们再次发送或接收新文本，它就不会出现在屏幕上。先生，请告诉我如何解决这个问题。感谢您。