在Facebook的应用程序为Android创建登录布局像应用程序、布局、Facebook、Android

2023-09-06 13:42:10 作者:归属感

我想打一个登录活动/布局类似于Facebook的应用程序有一个应用程序。当文本字段的重点是软键盘推动整个视图了,但没有挤压徽标我的意思是。我曾尝试安卓windowSoftInputMode =adjustPan / adjustResize,但它不是我想要的目的。

I want to make an app with a login activity/layout similar to what Facebook app has. What I mean is when text field is focused soft keyboard pushes the entire view up but not squashing a logo. I have tried android:windowSoftInputMode="adjustPan/adjustResize" but it is not what I was trying to achieve.

我发现this质疑的也许这会让事情更清晰,但它没有解决问题的办法。

I found this question on SO perhaps it will make things clearer, but it has no solution to the problem.

我也曾尝试各种布局类型,但它的软键盘只是推聚焦<的EditText>起来。请指引我。

I have also tried various layouts types but it soft keyboard only pushes the focused < EditText > up. Please guide me.

更新:

    <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    android:background="#DDDDDD">
    <RelativeLayout 
        android:height="0dp"
        android:layout_weight="1"
        android:layout_height="0dp"
        android:layout_width="fill_parent"
        android:background="#ff0000">
        <ImageView
            android:layout_centerVertical="true"
            android:layout_height="fill_parent"
            android:layout_width="fill_parent"></ImageView>
    </RelativeLayout>
    <RelativeLayout 
        android:height="0dp"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:layout_width="fill_parent"
        android:background="#00ff00">
    </RelativeLayout>

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:background="#0000ff"
        android:height="0dp" >

        <Button
            android:layout_width="fill_parent"
            android:layout_height="40dp"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            android:text="Log in" 
            />

        <EditText
            android:layout_width="fill_parent"
            android:layout_height="40dp"
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            android:padding="4dp"
            android:hint="password"
            android:inputType="textPassword" >
        </EditText>

        <EditText
            android:id="@+id/editText1"
            android:hint="login"
            android:padding="4dp"
            android:layout_width="fill_parent"
            android:layout_height="40dp"
            android:layout_alignParentTop="true"
            android:layout_centerHorizontal="true" ></EditText>
    </RelativeLayout>

</LinearLayout>

更新工作液 我不能在这里粘贴整个XML文件,但结构应该是足够的。 基于加布Sechan的回答。

UPDATE working solution I can't paste here the entire xml file, but the structure should be enough. Based on Gabe Sechan's answer.

Layout{
   Layout top weight 1
   Layout mid weight 1
   Layout bot weight 1
}

儿童布局已设置为:

Child layouts have set to:

android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"  // should be changed accordingly to your layout design. 

这里是一个Java code的活性(键盘上/下):

And here is a Java code for the activity(keyboard up/down):

View top, mid, bot;
    final View activityRootView = findViewById(R.id.loginLayout);
            activityRootView.getViewTreeObserver().addOnGlobalLayoutListener(
                    new OnGlobalLayoutListener() {
                        @Override
                        public void onGlobalLayout() {
                            int heightDiff = activityRootView.getRootView()
                                    .getHeight() - activityRootView.getHeight();
                            if (heightDiff > 100) { //keyboard up
                                mid.setVisibility(View.INVISIBLE);
                                top.setLayoutParams(new TableLayout.LayoutParams(
                                        LayoutParams.MATCH_PARENT, 0, 0f));
                                bot.setLayoutParams(new TableLayout.LayoutParams(
                                        LayoutParams.MATCH_PARENT, 0, 1f));

                            } else {// keyboard down
                                // v.setVisibility(View.VISIBLE);
                                mid.setVisibility(View.VISIBLE);
                                top.setLayoutParams(new TableLayout.LayoutParams(
                                        LayoutParams.MATCH_PARENT, 0, 2f));
                                bot.setLayoutParams(new TableLayout.LayoutParams(
                                        LayoutParams.MATCH_PARENT, 0, 3f));

                            }
                        }
                    });

在键盘的上你需要改变权重accourding键盘了设计和键盘上的向下变回默认值(如果您通过XML / Java的所设定的布局)。我测试的2.3.x及以上的code。 而且不要忘了使用安卓inputType =为TextFilter的登录和放大器;密码的EditText 的删除有关意见和建议节省一些像素。在您的清单中的活动安卓windowSoftInputMode =adjustResize | stateHidden stateHidden 是用来使键盘不会被活动时加载起来。希望它能帮助。祝你好运。

On keyboard up you need to change weights accourding to keyboard up design and on keyboard down change back to the default(layout that you've set via xml/java). I've tested the code on 2.3.x and up. And don't forget to use android:inputType="textFilter" for the login&password EditText's to remove suggestions on input and save some pixels. In your manifest for the activity android:windowSoftInputMode="adjustResize|stateHidden". stateHidden is used so that keyboard won't be up when activity loads. Hope it helps. Good luck.

推荐答案

他们正在做的,相对布局,adjustResize,和android:layout_centerVertical。基本上,他们有他们的主要布局的线性布局,在它的内部3同等权重相对布局。每个设置为0dp的高度,所以他们采取了屏幕的平等三分之二。顶部RelativeLayout的持有徽标,垂直居中。中间保持登录字段和按钮,垂直1中心在另一个的顶部。底部的一方的版权文本,对齐底部。最终的结果是,当键盘出现时,3个相对布局得到调整大小来利用新屏幕的1/3。然后它们的元素都集中在新的屏幕。

They're doing it with relative layouts, adjustResize, and android:layout_centerVertical. Basically, they have a linear layout for their main layout, with 3 equally weighted relative layouts inside of it. Each is set to 0dp height, so they take up equal thirds of the screen. The top RelativeLayout holds the logo, centered vertically. The middle holds the login fields and button, centered vertically one on top of the other. The bottom one holds the copyright text, aligned to bottom. The end result is that when the keyboard comes up, the 3 relative layouts get resized to take 1/3 of the new screen. Then their elements are centered in the new screen.

记住,你所需要的adjustResize窗口模式得到这个,如果你使用平移它只是移动和图案就会滚动偏离中心。

Remember you need the adjustResize window mode to get this, if you use pan it will just move up and the logo will scroll off center.