【问题标题】:Codename One TextArea Padding has no effectCodename One TextArea Padding 无效
【发布时间】:2018-06-20 22:53:44
【问题描述】:

附加图像中的 TextField 和 TextArea 具有相同的 UIID。我使用主题设计器将左侧填充设置为 1 毫米。

您可以看到左侧填充应用于 TextField 而不是 TextArea。

我还尝试使用 gui_TextArea.getAllStyles().setPaddingLeft(1); 在代码中手动设置它。和 gui_textArea.getAllStyles().setPadding(1,1,1,1);没有效果。

TextArea 似乎没有 setTextUIID() 方法。

我们如何设置这个组件的内边距?

根据史蒂夫的要求提供完整来源:

/*
 * To change this license header, choose License Headers in Project Properties.
 * To change this template file, choose Tools | Templates
 * and open the template in the editor.
 */
package com.this.that.gui;

import com.codename1.ui.Button;
import com.codename1.ui.Component;
import com.codename1.ui.Container;
import com.codename1.ui.Dialog;
import com.codename1.ui.Display;
import com.codename1.ui.TextField;
import com.codename1.ui.layouts.BoxLayout;
import com.codename1.ui.layouts.FlowLayout;
import com.codename1.ui.layouts.LayeredLayout;
import com.codename1.ui.plaf.Style;
import com.this.that.Constants;
import com.this.that.Main;
import com.this.that.util.MyNetwork;
import com.this.that.util.MyToolbar;
import com.this.that.util.MyValidator;
import com.this.that.util.User;
import java.util.HashMap;
import java.util.Map;

/**
 * GUI builder created Form
 */
public class Contact extends com.codename1.ui.Form {

    private User user;

    public Contact() {
        this(com.codename1.ui.util.Resources.getGlobalResources());
    }

    public Contact(com.codename1.ui.util.Resources resourceObjectInstance) {
        initGuiBuilderComponents(resourceObjectInstance);
        Style s = gui_Message.getAllStyles();
        s.setPaddingUnit(Style.UNIT_TYPE_DIPS);
        s.setPadding(6, 6, 6, 6);
        this.revalidate();
    }

//-- DON'T EDIT BELOW THIS LINE!!!
    private com.codename1.ui.Container gui_welcomeContainer = new com.codename1.ui.Container(new com.codename1.ui.layouts.BorderLayout());
    private com.codename1.ui.Label gui_null = new com.codename1.ui.Label();
    private com.codename1.ui.Container gui_BodyContainer = new com.codename1.ui.Container(new com.codename1.ui.layouts.BoxLayout(com.codename1.ui.layouts.BoxLayout.Y_AXIS));
    private com.codename1.ui.Label gui_spacer1 = new com.codename1.ui.Label();
    private com.codename1.ui.TextField gui_Subject = new com.codename1.ui.TextField();
    private com.codename1.ui.TextArea gui_Message = new com.codename1.ui.TextArea();
    private com.codename1.ui.Button gui_SubmitButton = new com.codename1.ui.Button();


// <editor-fold defaultstate="collapsed" desc="Generated Code">                          
    private void guiBuilderBindComponentListeners() {
        EventCallbackClass callback = new EventCallbackClass();
        gui_SubmitButton.addActionListener(callback);
    }

    class EventCallbackClass implements com.codename1.ui.events.ActionListener, com.codename1.ui.events.DataChangedListener {
        private com.codename1.ui.Component cmp;
        public EventCallbackClass(com.codename1.ui.Component cmp) {
            this.cmp = cmp;
        }

        public EventCallbackClass() {
        }

        public void actionPerformed(com.codename1.ui.events.ActionEvent ev) {
            com.codename1.ui.Component sourceComponent = ev.getComponent();

            if(sourceComponent.getParent().getLeadParent() != null && (sourceComponent.getParent().getLeadParent() instanceof com.codename1.components.MultiButton || sourceComponent.getParent().getLeadParent() instanceof com.codename1.components.SpanButton)) {
                sourceComponent = sourceComponent.getParent().getLeadParent();
            }

            if(sourceComponent == gui_SubmitButton) {
                onSubmitButtonActionEvent(ev);
            }
        }

        public void dataChanged(int type, int index) {
        }
    }
    private void initGuiBuilderComponents(com.codename1.ui.util.Resources resourceObjectInstance) {
        guiBuilderBindComponentListeners();
        setLayout(new com.codename1.ui.layouts.BoxLayout(com.codename1.ui.layouts.BoxLayout.Y_AXIS));
        setInlineStylesTheme(resourceObjectInstance);
        setScrollableY(false);
                setInlineStylesTheme(resourceObjectInstance);
        setTitle("");
        setName("Contact");
        addComponent(gui_welcomeContainer);
        gui_welcomeContainer.setUIID("welcomeContainer");
                gui_welcomeContainer.setInlineStylesTheme(resourceObjectInstance);
        gui_welcomeContainer.setName("welcomeContainer");
        ((com.codename1.ui.layouts.BorderLayout)gui_welcomeContainer.getLayout()).setCenterBehavior(com.codename1.ui.layouts.BorderLayout.CENTER_BEHAVIOR_CENTER);
        gui_welcomeContainer.addComponent(com.codename1.ui.layouts.BorderLayout.CENTER, gui_null);
        gui_null.setText("Contact Us");
        gui_null.setUIID("welcomeLabel");
                gui_null.setInlineStylesTheme(resourceObjectInstance);
        addComponent(gui_BodyContainer);
                gui_BodyContainer.setInlineStylesTheme(resourceObjectInstance);
        gui_BodyContainer.setName("BodyContainer");
        gui_BodyContainer.addComponent(gui_spacer1);
        gui_BodyContainer.addComponent(gui_Subject);
        gui_BodyContainer.addComponent(gui_Message);
        gui_BodyContainer.addComponent(gui_SubmitButton);
        gui_spacer1.setText(" ");
                gui_spacer1.setInlineStylesTheme(resourceObjectInstance);
        gui_spacer1.setName("spacer1");
        gui_Subject.setScrollVisible(true);
        gui_Subject.setHint("  Subject");
        gui_Subject.setUIID("TextField");
                gui_Subject.setInlineStylesTheme(resourceObjectInstance);
        gui_Subject.setName("Subject");
        gui_Subject.setColumns(20);
        gui_Message.setHint("  Please enter a brief message");
        gui_Message.setUIID("TextField");
                gui_Message.setInlineStylesTheme(resourceObjectInstance);
        gui_Message.setName("Message");
        gui_Message.setMaxSize(1000);
        gui_Message.setColumns(20);
        gui_Message.setRows(10);
        gui_SubmitButton.setText("Submit");
                gui_SubmitButton.setInlineStylesTheme(resourceObjectInstance);
        gui_SubmitButton.setName("SubmitButton");
        gui_SubmitButton.setTextPosition(com.codename1.ui.Component.BOTTOM);
        gui_welcomeContainer.setUIID("welcomeContainer");
                gui_welcomeContainer.setInlineStylesTheme(resourceObjectInstance);
        gui_welcomeContainer.setName("welcomeContainer");
        ((com.codename1.ui.layouts.BorderLayout)gui_welcomeContainer.getLayout()).setCenterBehavior(com.codename1.ui.layouts.BorderLayout.CENTER_BEHAVIOR_CENTER);
                gui_BodyContainer.setInlineStylesTheme(resourceObjectInstance);
        gui_BodyContainer.setName("BodyContainer");
    }// </editor-fold>

//-- DON'T EDIT ABOVE THIS LINE!!!
        public void onSubmitButtonActionEvent(com.codename1.ui.events.ActionEvent ev) {
        if (gui_Subject.getText().equals("") || gui_Message.getText().equals("")) {
            Main.showDialog("You must enter all fields.");
        } else {
            if (user.getName() == null || user.getEmail() == null) {
                requestNameOrEmail();
            }
            else{
                sendMessage(false);
            }
        }
    }

    private void requestNameOrEmail(){
        Dialog d = new Dialog(new BoxLayout(BoxLayout.Y_AXIS));
        d.setTitle("Require Name/Email to Send");

        Container nameLayeredLayout = new Container(new LayeredLayout());
        TextField name = new TextField();
        name.setHint("Name");
        nameLayeredLayout.add(name);

        Container emailLayeredLayout = new Container(new LayeredLayout());
        TextField email = new TextField();
        email.setHint("Email");
        emailLayeredLayout.add(email);

        if(user.getName() != null){
            name.setText(user.getName());
        }
        if(user.getEmail() != null){
            email.setText(user.getEmail());
        }

        Map<String, Boolean> validatorParams = new HashMap<>();
        validatorParams.put("name", false);
        validatorParams.put("email", false);
        MyValidator v = new MyValidator(validatorParams);
        v.setupLengthConstraint(nameLayeredLayout, name, 2, 30, "name", "Name must be 2-30 characters.");
        v.setupEmailConstraint(emailLayeredLayout, email, "email", "Email not valid.");

        Container buttonCnt = new Container();
        Button cancel = new Button("Cancel");
        cancel.addActionListener((l) -> {
            d.dispose();
        });

        Button submit = new Button("Submit");
        submit.addActionListener((l) -> {
            if (v.isValid()) {
                d.dispose();
                sendMessage(true);
            }

        });
        buttonCnt.add(cancel).add(submit);

        d.add(nameLayeredLayout).add(emailLayeredLayout).add(FlowLayout.encloseCenter(buttonCnt));
        d.show();
    }

    private void sendMessage(boolean updateUser) {
        Map<String, String> params = new HashMap<>();
        params.put("update_user",String.valueOf(updateUser));
        params.put("sender_name", user.getName());
        params.put("sender_email", user.getEmail());
        params.put("sender_udid", Display.getInstance().getUdid());
        params.put("subject", gui_Subject.getText());
        params.put("message", gui_Message.getText());
        MyNetwork.getInstance().getNetworkObject("POST", Constants.SEND_EMAIL, params, "noDialog");
        Main.showDialog("Message sent.");
        Home form = new Home();
        MyToolbar.getInstance().setupToolbar(form);
        form.show();
    }

}

这是表单的 .gui

<?xml version="1.0" encoding="UTF-8"?>

<component type="Form" layout="BoxLayout" boxLayoutAxis="Y"  scrollableY="false" title="" name="Contact">
    <component type="Container" layout="BorderLayout" borderLayoutAbsoluteCenter="true"  uiid="welcomeContainer" name="welcomeContainer">
        <component type="Label" uiid="welcomeLabel" text="Contact Us">
            <layoutConstraint value="Center" />
        </component>
    </component>
    <component type="Container" layout="BoxLayout" boxLayoutAxis="Y"  name="BodyContainer">
        <component type="Label" text=" " name="spacer1">
        </component>
        <component type="TextField" uiid="TextField" hint="  Subject" scrollVisible="true" columns="20" constraint="0" name="Subject">
        </component>
        <component type="TextArea" uiid="TextField" hint="  Please enter a brief message" rows="10" columns="20" maxSize="1000" constraint="0" name="Message">
        </component>
        <component type="Button" text="Submit" textPosition="2" name="SubmitButton" actionEvent="true">
        </component>
    </component>
</component>

以下是theme.xml 中的相关行(uiid 设置为TextField)

    <gradient key="TextArea.bgGradient" color1="0" color2="0" posX="0.5" posY="0.5" radius="1.0" />
    <val key="TextArea.bgType" value="0" />
    <border key="TextArea.border" type="image" i1="TextField.borderTop_1.png" i2="TextField.borderBottom_1.png" i3="TextField.borderLeft_1.png" i4="TextField.borderRight_1.png" i5="TextField.borderTopL_1.png" i6="TextField.borderTopR_1.png" i7="TextField.borderBottomL_1.png" i8="TextField.borderBottomR_1.png" i9="TextField.borderCenter_1.png" />
    <val key="TextArea.fgColor" value="0" />
    <font key="TextArea.font" type="ttf" face="0" style="0" size="0" name="native:MainRegular" family="native:MainRegular" sizeSettings="3" actualSize="3.0" />
    <val key="TextArea.marUnit" value="2,2,2,2" />
    <val key="TextArea.margin" value="1.0,1.0,1.0,1.0" />
    <val key="TextArea.padUnit" value="2,2,2,2" />
    <val key="TextArea.padding" value="0.0,0.0,2.0,1.0" />
    <gradient key="TextArea.press#bgGradient" color1="0" color2="0" posX="0.5" posY="0.5" radius="1.0" />
    <val key="TextArea.press#bgType" value="0" />
    <border key="TextArea.press#border" type="image" i1="TextField.borderTop_1.png" i2="TextField.borderBottom_1.png" i3="TextField.borderLeft_1.png" i4="TextField.borderRight_1.png" i5="TextField.borderTopL_1.png" i6="TextField.borderTopR_1.png" i7="TextField.borderBottomL_1.png" i8="TextField.borderBottomR_1.png" i9="TextField.borderCenter_1.png" />
    <val key="TextArea.press#fgColor" value="0" />
    <font key="TextArea.press#font" type="ttf" face="0" style="0" size="0" name="native:MainRegular" family="native:MainRegular" sizeSettings="3" actualSize="3.0" />
    <val key="TextArea.press#marUnit" value="2,2,2,2" />
    <val key="TextArea.press#margin" value="1.0,1.0,1.0,1.0" />
    <val key="TextArea.press#padUnit" value="2,2,2,2" />
    <val key="TextArea.press#padding" value="0.0,0.0,2.0,1.0" />
    <val key="TextArea.press#transparency" value="0" />
    <gradient key="TextArea.sel#bgGradient" color1="0" color2="0" posX="0.5" posY="0.5" radius="1.0" />
    <val key="TextArea.sel#bgType" value="0" />
    <border key="TextArea.sel#border" type="image" i1="TextField.borderTop_1.png" i2="TextField.borderBottom_1.png" i3="TextField.borderLeft_1.png" i4="TextField.borderRight_1.png" i5="TextField.borderTopL_1.png" i6="TextField.borderTopR_1.png" i7="TextField.borderBottomL_1.png" i8="TextField.borderBottomR_1.png" i9="TextField.borderCenter_1.png" />
    <val key="TextArea.sel#fgColor" value="0" />
    <font key="TextArea.sel#font" type="ttf" face="0" style="0" size="0" name="native:MainRegular" family="native:MainRegular" sizeSettings="3" actualSize="3.0" />
    <val key="TextArea.sel#marUnit" value="2,2,2,2" />
    <val key="TextArea.sel#margin" value="1.0,1.0,1.0,1.0" />
    <val key="TextArea.sel#padUnit" value="2,2,2,2" />
    <val key="TextArea.sel#padding" value="0.0,0.0,2.0,1.0" />
    <val key="TextArea.sel#transparency" value="0" />
    <val key="TextArea.transparency" value="0" />
    <gradient key="TextField.bgGradient" color1="0" color2="0" posX="0.5" posY="0.5" radius="1.0" />
    <val key="TextField.bgType" value="0" />
    <border key="TextField.border" type="image" i1="TextField.borderTop_1.png" i2="TextField.borderBottom_1.png" i3="TextField.borderLeft_1.png" i4="TextField.borderRight_1.png" i5="TextField.borderTopL_1.png" i6="TextField.borderTopR_1.png" i7="TextField.borderBottomL_1.png" i8="TextField.borderBottomR_1.png" i9="TextField.borderCenter_1.png" />
    <val key="TextField.fgColor" value="0" />
    <font key="TextField.font" type="ttf" face="0" style="0" size="0" name="native:MainRegular" family="native:MainRegular" sizeSettings="3" actualSize="3.0" />
    <val key="TextField.marUnit" value="2,2,2,2" />
    <val key="TextField.margin" value="1.0,1.0,1.0,1.0" />
    <val key="TextField.padUnit" value="0,2,0,2" />
    <val key="TextField.padding" value="0.0,0.0,2.0,1.0" />
    <gradient key="TextField.press#bgGradient" color1="0" color2="0" posX="0.5" posY="0.5" radius="1.0" />
    <val key="TextField.press#bgType" value="0" />
    <border key="TextField.press#border" type="image" i1="TextField.borderTop_1.png" i2="TextField.borderBottom_1.png" i3="TextField.borderLeft_1.png" i4="TextField.borderRight_1.png" i5="TextField.borderTopL_1.png" i6="TextField.borderTopR_1.png" i7="TextField.borderBottomL_1.png" i8="TextField.borderBottomR_1.png" i9="TextField.borderCenter_1.png" />
    <val key="TextField.press#fgColor" value="0" />
    <font key="TextField.press#font" type="ttf" face="0" style="0" size="0" name="native:MainRegular" family="native:MainRegular" sizeSettings="3" actualSize="3.0" />
    <val key="TextField.press#marUnit" value="2,2,2,2" />
    <val key="TextField.press#margin" value="1.0,1.0,1.0,1.0" />
    <val key="TextField.press#padUnit" value="0,2,0,2" />
    <val key="TextField.press#padding" value="0.0,0.0,1.0,1.0" />
    <val key="TextField.press#transparency" value="0" />
    <gradient key="TextField.sel#bgGradient" color1="0" color2="0" posX="0.5" posY="0.5" radius="1.0" />
    <val key="TextField.sel#bgType" value="0" />
    <border key="TextField.sel#border" type="image" i1="TextField.borderTop_1.png" i2="TextField.borderBottom_1.png" i3="TextField.borderLeft_1.png" i4="TextField.borderRight_1.png" i5="TextField.borderTopL_1.png" i6="TextField.borderTopR_1.png" i7="TextField.borderBottomL_1.png" i8="TextField.borderBottomR_1.png" i9="TextField.borderCenter_1.png" />
    <val key="TextField.sel#fgColor" value="0" />
    <font key="TextField.sel#font" type="ttf" face="0" style="0" size="0" name="native:MainRegular" family="native:MainRegular" sizeSettings="3" actualSize="3.0" />
    <val key="TextField.sel#marUnit" value="2,2,2,2" />
    <val key="TextField.sel#margin" value="1.0,1.0,1.0,1.0" />
    <val key="TextField.sel#padUnit" value="0,2,0,2" />
    <val key="TextField.sel#padding" value="0.0,0.0,1.0,1.0" />
    <val key="TextField.sel#transparency" value="0" />
    <val key="TextField.transparency" value="0" />

这是主题设计器的屏幕截图,显示了所选文本字段 UIID 的填充。以毫米为单位的填充也适用于未选择和按下。两个组件共享此 UIID,但填充仅出现在文本字段组件上,而不是文本区域组件上。如果我在代码中添加的用于设置填充的行存在或不存在,此行为不会改变。

您在屏幕截图中看到左右都以毫米为单位,而顶部/底部以像素为单位。我还设置了它,以便所有四个单位都是 mm,并且它没有改变行为。

(我们使用的是CN1 v4.0)

【问题讨论】:

  • 我似乎无法用您在此处发布的内容重现此问题。在这一点之后,某些东西必须覆盖该文本区域的填充。您可以发布课程的完整源代码吗?
  • @stevehannah,我修改了问题以包含完整源代码。
  • @stevehannah,请注意,我在类中包含 setPadding 的唯一原因是因为在主题设计器中设置填充时没有应用填充。理想情况下,主题设计器中设置的填充应该可以工作,但它似乎没有。

标签: codenameone


【解决方案1】:

为了解决这个问题,我最终做了以下事情:

  1. 将我的项目恢复为之前的提交,该提交没有任何 TextArea 或 TextField 填充样式
  2. 在主题设计器中,我逐个编辑了每个状态的填充,而不是将样式从一种状态复制到另一种状态。

我怀疑但不能确定问题是由在主题设计器中复制/粘贴样式的行为引起的。 AFAIK 这是样式的工作版本和非工作版本之间的唯一区别。我似乎记得过去在设计器中进行复制/粘贴时遇到了问题。

【讨论】:

    【解决方案2】:

    setPaddingLeft(1); 将覆盖setPadding(1,1,1,1);,反之亦然。您需要确保在显示表单之前执行这些操作,如果您在需要重新验证之后执行这些操作,因为这会影响布局。

    但是,在您的情况下,我猜您需要调用 setPaddingUnit(Style.UNIT_TYPE_DIPS); 以确保填充位于可见单元中。确保setPadding 调用之前调用该函数。

    Form hi = new Form("Padding", BoxLayout.y());
    
    TextArea unpadded = new TextArea("Unpadded");
    TextArea padded = new TextArea("Padded");
    Style s = padded.getAllStyles();
    s.setPaddingUnit(Style.UNIT_TYPE_DIPS);
    s.setPadding(6, 6, 6, 6);
    hi.addAll(unpadded, padded);
    
    hi.show();
    

    【讨论】:

    • 添加 setPaddingUnit() 和 revalidate() 似乎没有什么不同。我在问题中添加了一个代码 sn-p。为什么在主题设计器中设置填充也不起作用?
    • 因此,从您编辑的答案看来,您似乎表明为了在 TextArea 上进行填充,我们必须以编程方式创建表单?我们的应用程序是使用 GUI 构建器和主题设计器构建的。为什么填充不适用于 GUI Builder 和 Theme Designer?我还使用了 Style s = padded.getAllStyles();等在您的示例中代替我示例中的代码,然后重新验证。这没有用。为什么显示并重新验证表单后它不起作用?
    • 没有。除非您在 GUI 构建器中设置样式与代码相矛盾,否则它与 GUI 构建器的工作方式完全相同。
    • 请查看我应史蒂夫要求添加的完整源代码。如果我删除第 40-43 行以便仅存在 GUI 构建器样式,则不会应用填充。 (我添加了第 40-43 行以尝试强制填充,因为 GUI 构建器样式不起作用)我已经附加了适用于这些元素的 GUI 构建器 .xml 文件中的每一行。从我上面的源代码中可以看出,TextField 或 TextArea 的样式没有其他地方被修改过。
    • 好的,我错过了 XML 中的一些内容,它有点太长了。但我仍然看不到太多填充...&lt;val key="TextField.sel#padUnit" value="0,2,0,2" /&gt; &lt;val key="TextField.sel#padding" value="0.0,0.0,1.0,1.0" /&gt;。由于文本布局算法不同,因此在多行上比在单行上需要更多的填充。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-08-28
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多