在代号一中设置 SideCommand 样式会在 IOS 和 Android 上给出不同的结果

Posted 2023-03-22

【中文标题】在代号一中设置 SideCommand 样式会在 IOS 和 Android 上给出不同的结果

【英文标题】：Styling SideCommand in codename one gives different results on IOS and Android

【发布时间】：2020-02-15 09:42:46

【问题描述】：

我有一个通过 CSS 的侧边菜单样式，在 android 上，达到了预期的结果，但在 ios 上同样的样式中断了。看起来我需要访问 SideCommand 内的按钮来实现这一点，但是，我被困在这个按钮上。下面是CSS和代号一码。

SideCommand
        background-color: #018de5;
        padding: 2mm;
        color: white;
        font-size: 3mm;
        border-width: 0mm;
        margin: 0.2mm 0mm 0mm 0mm;
    

mainToolbar.addComponentToSideMenu(avatarBox);
    mainToolbar.addMaterialCommandToSideMenu("Home", FontImage.MATERIAL_HOME, e -> 
        try 
            Home();
         catch (JSONException ex) 
            System.err.println("there is error");
        
    );
    mainToolbar.addMaterialCommandToSideMenu("Credit", FontImage.MATERIAL_CREDIT_CARD, e -> 
        credithome.Home(this);
    );

    mainToolbar.addMaterialCommandToSideMenu("Clients", FontImage.MATERIAL_PEOPLE, e -> 
        clienthome.Home(this);
    );

    mainToolbar.addMaterialCommandToSideMenu("Accounting", FontImage.MATERIAL_BOOK, e -> 

        accountinghome.Home(this);
    );

IOS上的结果是

安卓也不错

【问题讨论】：

关于 iPhone 刘海下面的文字，也许这个有用：codenameone.com/blog/safe-areas.html

【参考方案1】：

您还需要使用空边框覆盖边框属性，因为 iOS 上的默认主题包含侧边命令的边框。这是我们希望在未来解决的问题，但现在它就在那里。

例如

SideCommand
  background-color: #018de5;
  padding: 2mm;
  color: white;
  font-size: 3mm;
  border: none;
  margin: 0.2mm 0mm 0mm 0mm;

【讨论】：

非常感谢@Shai Almog，它马上就起作用了！！