每次按下按钮时如何在屏幕上向上移动文本 [英] How to move text upwards on the screen every time a button is pressed

问题描述

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

I want to develop a chatting application for android. It will receive messages from the controller on the site. For this i have started designing a GUI. After practicing and studying a few codes I have been able to design a text box, a button and a label. When button is pressed, text in the text box gets displayed on the label named 'Display' and text box gets cleared. However now i want that with each time button is clicked text should move upwards and it's space should be replaced with the text in the text box. Similarly text from the sender should appear on the right side and text received should be displayed on left side of the screen. It might be a silly question but as i am totally new to python and kivy thing it is getting hard for me after trying it for over a week. Please guide me on this. Below is the code. This is 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

推荐答案

聊天应用-建议

Kivy标签»文本对齐和包装

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

Chat App - Suggestion

Kivy Label » Text alignment and wrapping

• Declare a custom widget with inheritance of Label widget so that you can control the text alignment i.e. left for text sent, and right for text received.

<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

Kivy RecycleView

• Replace Label: with RecycleView:
• Use CustomLabel as the viewclass
• Append text sent or text received to RecycleView's data

RecycleView:
    id: rv
    viewclass: 'CustomLabel'

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

Kivy RecycleView»数据

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

The view is generatad by processing the data, essentially a list of dicts, and uses these dicts to generate instances of the viewclass as required.

data

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

The data used by the current view adapter. This is a list of dicts whose keys map to the corresponding property names of the viewclass.

数据是 AliasProperty 获取并设置用于 生成视图.

data is an AliasProperty that gets and sets the data used to generate the views.

摘要-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'

输出

这篇关于每次按下按钮时如何在屏幕上向上移动文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！