代码之家 › 专栏 › 技术社区 › DJhon

使用不同的文本样式绘制自定义视图或按钮

view android

-1

DJhon · 技术社区 · 6 年前

我想在我的Android移动UI中放置一个由按钮或视图组成的网格。每个按钮应如下所示

如何使用两种不同样式的文本绘制这样的按钮或视图。很明显,数据

158

将从服务器不断更新。请推荐我。

2 回复 | 直到 6 年前

geniuSkid 6 年前

----------
Create a layout like this:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:tools="http://schemas.android.com/tools"
    android:background="@color/dim_grey">

  <!--  <LinearLayout
        android:id="@+id/no_trips"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:gravity="center"
        android:orientation="vertical"
        android:visibility="gone">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:fontFamily="sans-serif-smallcaps"
            android:gravity="center"
            android:text="@string/no_active_trips"
            android:textColor="@color/rose"
            android:textSize="14sp"
            android:textStyle="bold" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="15dp"
            android:fontFamily="sans-serif-smallcaps"
            android:gravity="center"
            android:text="@string/you_online"
            android:textColor="@color/dark_greem"
            android:textSize="20sp"
            android:textStyle="bold" />

    </LinearLayout>

    <LinearLayout
        android:id="@+id/in_trip_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:gravity="center"
        android:orientation="vertical"
        android:padding="4dp"
        android:visibility="gone"
        tools:ignore="UseCompoundDrawables">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="center"
            android:contentDescription="@null"
            android:minHeight="75dp"
            android:minWidth="75dp"
            android:src="@drawable/ic_car_24dp" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:fontFamily="sans-serif-smallcaps"
            android:gravity="center"
            android:text="@string/in_a_trip"
            android:textColor="@color/primaryDark_violet"
            android:textSize="18sp"
            android:textStyle="bold" />

    </LinearLayout>

    <LinearLayout
        android:id="@+id/offline_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:gravity="center"
        android:orientation="vertical"
        android:padding="4dp"
        android:visibility="gone">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="8dp"
            android:gravity="center"
            android:text="@string/you_offline"
            android:textSize="30sp" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="18dp"
            android:gravity="center"
            android:text="@string/go_online_to_se"
            android:textColor="@color/rose"
            android:textSize="16sp" />

        <android.support.v7.widget.AppCompatButton
            android:id="@+id/go_online"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/ripple"
            android:gravity="center"
            android:minHeight="0dp"
            android:padding="10dp"
            android:text="@string/go_online"
            android:textColor="@color/white" />


    </LinearLayout>


    <android.support.v7.widget.RecyclerView
        android:id="@+id/recycler_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:visibility="gone"
        app:layoutManager="android.support.v7.widget.LinearLayoutManager" />-->


    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:layout_centerInParent="true"
        android:background="@drawable/rectangle_border"
        android:padding="16dp">


        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:padding="18dp"
            android:background="@drawable/rectangle_border"
            android:orientation="vertical">

            <TextView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:text="Coolant\ntemperature"
                android:gravity="center"
                android:padding="2dp"
                android:layout_marginBottom="8dp"/>

            <TextView
                android:id="@+id/heat_value"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="150.6"
                android:gravity="center"
                android:textSize="28sp"
                android:padding="2dp"/>

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="F"
                android:textSize="20sp"/>

        </LinearLayout>


    </LinearLayout>


</RelativeLayout>


    ----------
    Download custom font style and add it under "font" folder in res
    You can download digitalfont.ttf as you need

    I downloaded this font from here -> http://www.1001fonts.com

    ----------
    Then in Java file 

    TextView updatableTv;
    updatableTv = (TextView) findViewById(R.id.heat_value);

    Typeface customTypeface = ResourcesCompat.getFont(this, R.font.digital_clock);
    updatableTv.setTypeface(customTypeface);

    now update your textview with values from server

sneharc 6 年前

你可以用多种方法,我用 downloadable fonts 在这里

在模块的构建中添加依赖项。gradle文件:

dependencies { compile 'com.android.support:support-compat:26.0.1' }
在项目级构建中添加Google的maven存储库。gradle文件:

repositories { google() }

现在创建具有多个 TextView ,具有不同的可下载字体:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:orientation="vertical">

<TextView
    android:id="@+id/tempText"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center_horizontal"
    android:text="Coolant Temperature"
    android:textSize="20sp"
    app:fontFamily="@font/sanchez" />

<TextView
    android:id="@+id/tempVal"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center_horizontal"
    android:paddingBottom="10dp"
    android:paddingTop="10dp"
    android:text="158.0"
    android:textSize="30sp"
    app:fontFamily="@font/orbitron_medium" />

<TextView
    android:id="@+id/tempUnit"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center_horizontal"
    android:text="F"
    android:textSize="20sp"
    app:fontFamily="@font/sanchez" />
</LinearLayout>

选择 文本框 更改字体并切换到“设计”模式
从“属性”中选择“fontFamily”选项,单击“更多字体”,然后选择所需的字体

有关更多详细信息,请参阅此帖子: downloadable-fonts-with-support-library