材料设计 - 浮动EditText实现

时间:2015-06-26 00:00:35

标签: android xml android-edittext material-design android-design-library

我试图实现浮动EditText的新Material Design,但我遇到了错误。所以,我正在使用最新的Android支持设计库'谷歌于2015年5月29日发布。根据说明,我按照以下内容通过build.gradle文件编译库:

compile 'com.android.support:design:22.2.+'

根据Android Developers Blog

  

虽然EditText单独会在输入第一个字符后隐藏提示文本,但您现在可以将其包装在TextInputLayout中,从而使提示文本成为EditText上方的浮动标签,从而确保用户永远不会丢失它们的上下文正在进入。

所以,这是我在布局xml文件上的代码,有问题的代码的id为android:id =" @ + id / viewTest"和android:id =" @ + id / fNameTest:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/mainFragmentViewGroup"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:focusable="true"
    android:focusableInTouchMode="true">

    <ScrollView
        android:id="@+id/scrollableContents"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="@color/background">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:paddingBottom="80dp"
            android:paddingLeft="16dp"
            android:paddingRight="16dp">

            <view
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                class="android.support.design.widget.TextInputLayout"
                android:id="@+id/viewTest"
                android:layout_alignParentBottom="true"
                android:layout_alignParentStart="true" >

                <EditText
                    android:id="@+id/fNameTest"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:ems="10"
                    android:hint="First Name"/>
            </view>

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal">

                <ImageView
                    android:id="@+id/roiInitialInvestmentHelpImageView"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentBottom="true"
                    android:layout_alignParentStart="true"
                    android:background="?android:attr/selectableItemBackgroundBorderless"
                    android:paddingBottom="2dp"
                    android:paddingEnd="@dimen/activity_horizontal_margin"
                    android:src="@drawable/ic_currency_usd" />

                <LinearLayout
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentEnd="true"
                    android:layout_toEndOf="@+id/roiInitialInvestmentHelpImageView"
                    android:orientation="vertical">

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:fontFamily="sans-serif-medium"
                        android:labelFor="@+id/roiInitialInvestmentEditText"
                        android:paddingTop="@dimen/activity_double_vertical_margin"
                        android:text="Initial Investment"
                        android:textColor="@color/accent"
                        android:textSize="20sp" />

                    <EditText
                        android:id="@+id/roiInitialInvestmentEditText"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:digits="0123456789.,"
                        android:inputType="numberDecimal"
                        android:text=""
                        android:textColor="@color/primary_text_default_material_light" />

                </LinearLayout>

            </RelativeLayout>

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal">

                <ImageView
                    android:id="@+id/roiReturnAmountHelpImageView"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentBottom="true"
                    android:layout_alignParentStart="true"
                    android:background="?android:attr/selectableItemBackgroundBorderless"
                    android:paddingBottom="2dp"
                    android:paddingEnd="@dimen/activity_horizontal_margin"
                    android:src="@drawable/ic_currency_usd" />

                <LinearLayout
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentEnd="true"
                    android:layout_toEndOf="@+id/roiReturnAmountHelpImageView"
                    android:orientation="vertical">

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:fontFamily="sans-serif-medium"
                        android:labelFor="@+id/roiReturnAmountEditText"
                        android:paddingTop="@dimen/activity_double_vertical_margin"
                        android:text="Return Amount"
                        android:textColor="@color/accent"
                        android:textSize="20sp" />

                    <EditText
                        android:id="@+id/roiReturnAmountEditText"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:digits="0123456789.,"
                        android:inputType="numberDecimal"
                        android:text=""
                        android:textColor="@color/primary_text_default_material_light" />

                </LinearLayout>

            </RelativeLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:layout_marginTop="32dp"
                android:orientation="horizontal">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:fontFamily="sans-serif-medium"
                    android:text="Period"
                    android:textColor="@color/accent"
                    android:textSize="20sp" />

            </LinearLayout>

            <LinearLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical">

                <LinearLayout
                    android:layout_width="fill_parent"
                    android:layout_height="72dp"
                    android:orientation="horizontal">

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center_vertical"
                        android:width="64dp"
                        android:text="Years"
                        android:textColor="@color/secondary_text_material_light"
                        android:textSize="16sp" />

                    <SeekBar
                        android:id="@+id/roiYearSeekBar"
                        android:layout_width="0dp"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center_vertical"
                        android:layout_weight="1"
                        android:max="10" />

                    <TextView
                        android:id="@+id/roiYearTextView"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center_vertical"
                        android:width="40dp"
                        android:gravity="center"
                        android:text="0"
                        android:textColor="@color/secondary_text_material_light"
                        android:textSize="16sp" />

                </LinearLayout>

                <LinearLayout
                    android:layout_width="fill_parent"
                    android:layout_height="72dp"
                    android:orientation="horizontal">

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center_vertical"
                        android:width="64dp"
                        android:text="Months"
                        android:textColor="@color/secondary_text_material_light"
                        android:textSize="16sp" />

                    <SeekBar
                        android:id="@+id/roiMonthSeekBar"
                        android:layout_width="0dp"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center_vertical"
                        android:layout_weight="1"
                        android:max="11" />

                    <TextView
                        android:id="@+id/roiMonthTextView"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center_vertical"
                        android:width="40dp"
                        android:gravity="center"
                        android:text="0"
                        android:textColor="@color/secondary_text_material_light"
                        android:textSize="16sp" />

                </LinearLayout>

            </LinearLayout>

        </LinearLayout>

    </ScrollView>
</RelativeLayout>

我得到的错误如下:

enter image description here

以下LogCat消息:

    06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2325)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2387)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.app.ActivityThread.access$800(ActivityThread.java:151)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1303)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.os.Handler.dispatchMessage(Handler.java:102)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.os.Looper.loop(Looper.java:135)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.app.ActivityThread.main(ActivityThread.java:5254)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at java.lang.reflect.Method.invoke(Native Method)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at java.lang.reflect.Method.invoke(Method.java:372)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:903)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:698)
06-26 00:41:33.018: E/AndroidRuntime(11085): Caused by: android.view.InflateException: Binary XML file line #25: Error inflating class android.support.design.widget.TextInputLayout
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.view.LayoutInflater.createView(LayoutInflater.java:633)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:743)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.view.LayoutInflater.rInflate(LayoutInflater.java:806)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.view.LayoutInflater.rInflate(LayoutInflater.java:809)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.view.LayoutInflater.rInflate(LayoutInflater.java:809)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.view.LayoutInflater.inflate(LayoutInflater.java:504)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.view.LayoutInflater.inflate(LayoutInflater.java:414)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at uk.co.codepix.calculator.ui.fragments.RoiInputCalcFrag.onCreateView(RoiInputCalcFrag.java:42)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.app.Fragment.performCreateView(Fragment.java:2053)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.app.FragmentManagerImpl.moveToState(FragmentManager.java:894)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.app.FragmentManagerImpl.moveToState(FragmentManager.java:1067)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.app.BackStackRecord.run(BackStackRecord.java:834)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.app.FragmentManagerImpl.execPendingActions(FragmentManager.java:1452)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.app.Activity.performStart(Activity.java:6005)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2288)
06-26 00:41:33.018: E/AndroidRuntime(11085):    ... 10 more
06-26 00:41:33.018: E/AndroidRuntime(11085): Caused by: java.lang.reflect.InvocationTargetException
06-26 00:41:33.018: E/AndroidRuntime(11085):    at java.lang.reflect.Constructor.newInstance(Native Method)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at java.lang.reflect.Constructor.newInstance(Constructor.java:288)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.view.LayoutInflater.createView(LayoutInflater.java:607)
06-26 00:41:33.018: E/AndroidRuntime(11085):    ... 24 more
06-26 00:41:33.018: E/AndroidRuntime(11085): Caused by: java.lang.RuntimeException: Failed to resolve attribute at index 18
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.content.res.TypedArray.getColor(TypedArray.java:401)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.support.design.widget.CollapsingTextHelper.setCollapsedTextAppearance(CollapsingTextHelper.java:166)
06-26 00:41:33.018: E/AndroidRuntime(11085):    at android.support.design.widget.TextInputLayout.<init>(TextInputLayout.java:106)
06-26 00:41:33.018: E/AndroidRuntime(11085):    ... 27 more

知道为什么会发生这些错误?

1 个答案:

答案 0 :(得分:0)

所以我发现了问题所在。如果确保将styles.xml上的主题设置为:

,问题就会消失
modalInstance.result.then(function (entity) {...});

这解决了我的问题。以前我有&#34;材料&#34;到位。