android 自定义dialog中怎么更新ui 安卓自定义ui

转载

mob64ca140ac564 2023-12-14 04:16:08

文章标签 android xml Android 文章分类 Android 移动开发

众所周知，iPhone为UI元素提供了很好的本机控件。基本上，当我的同事使用Magentic iPhone应用程序时，我也想为Android制作一个。但是在Android平台上，我没有相同类型的用户界面控件，所以我决定探索Android原生选项的强大功能，以便创建我的自定义UI。
当然，我们可以使用这些步骤为Android应用程序创建任何自定义UI元素。

出于本文的目的，我们将为Android Magentic应用程序创建自定义详细信息视图，其中应显示有关所选ListView项目的详细信息。

android 自定义dialog中怎么更新ui 安卓自定义ui_xml

为了开始，我们需要安装带有ADT工具插件的Eclipse以及已经安装和配置的Android SDK。

基本步骤：

创建布局xml文件

使用Eclipse和项目的res / layout文件夹创建或打开现有的android项目，为新的详细信息屏幕创建布局文件。

<!--?xml version="1.0" encoding="utf-8"?--><?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" >
 
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="35dip"
android:background="@drawable/header"
android:orientation="horizontal"
android:padding="0dip" >
 
<TextView
android:id="@+id/apptitle"
style="@style/TitleText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginLeft="5dip"
android:padding="0dip"
android:text="@string/app_title" />
</LinearLayout>
 
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@color/backgroundGrey" >
 
<TableLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@color/backgroundGrey"
android:padding="15dip"
android:stretchColumns="1" >
 
<TableRow
android:layout_marginBottom="0dip"
android:background="@drawable/multitext_top" >
 
<TextView
style="@style/BoldText"
android:padding="7dip"
android:text="@string/detail_log_file" />
</TableRow>
 
<TableRow
android:layout_marginBottom="10dip"
android:background="@drawable/multitext_bottom" >
 
<TextView
android:id="@+id/log_file"
style="@style/DetailRightText"
android:layout_width="0dip"
android:layout_span="2"
android:gravity="right"
android:padding="7dip" />
</TableRow>
 
<TableRow
android:layout_marginBottom="10dip"
android:background="@drawable/rounded_edittext" >
 
<TextView
style="@style/BoldText"
android:padding="7dip"
android:text="@string/detail_log_id" />
 
<TextView
android:id="@+id/log_id"
style="@style/DetailRightText"
android:gravity="right"
android:padding="7dip"
android:singleLine="true" />
</TableRow>
 
<TableRow android:background="@drawable/multitext_top" >
 
<TextView
style="@style/BoldText"
android:layout_span="2"
android:padding="7dip"
android:text="@string/detail_message" />
</TableRow>
 
<TableRow
android:layout_marginBottom="10dip"
android:background="@drawable/multitext_bottom" >
 
<TextView
android:id="@+id/log_message"
style="@style/DetailMessageText"
android:layout_span="2"
android:layout_weight="1"
android:padding="7dip" />
</TableRow>
 
<TableRow
android:layout_marginBottom="10dip"
android:background="@drawable/rounded_edittext" >
 
<TextView
style="@style/BoldText"
android:padding="7dip"
android:text="@string/detail_priority" />
 
<TextView
android:id="@+id/log_priority"
style="@style/DetailRightText"
android:gravity="right"
android:padding="7dip"
android:singleLine="true" />
</TableRow>
 
<TableRow
android:layout_marginBottom="10dip"
android:background="@drawable/rounded_edittext" >
 
<TextView
style="@style/BoldText"
android:padding="7dip"
android:text="@string/detail_priority_name" />
 
<TextView
android:id="@+id/log_priority_name"
style="@style/DetailRightText"
android:gravity="right"
android:padding="7dip"
android:singleLine="true" />
</TableRow>
 
<TableRow
android:layout_marginBottom="0dip"
android:background="@drawable/multitext_top" >
 
<TextView
style="@style/BoldText"
android:padding="7dip"
android:text="@string/detail_timestamp" />
</TableRow>
 
<TableRow
android:layout_marginBottom="10dip"
android:background="@drawable/multitext_bottom" >
 
<TextView
android:id="@+id/log_timestamp"
style="@style/DetailMessageText"
android:layout_span="2"
android:layout_weight="1"
android:padding="7dip" />
</TableRow>
</TableLayout>
</ScrollView>
</LinearLayout>

如您所见，我创建了线性布局作为容器并在其中，为了滚动的目的，ScrollView。

在ScrollView中，我放了TableLayout，因为为了这个细节视图的目的，我需要在某些行中有两列 - 显示一些标签值数据。

当然，在每个TableRow中都有一些TextView控件，其中将显示实际值。

我还为文本显示定义了一些样式，以避免重复字体格式值。

在MainActivity类中，我们需要放置这样的东西才能使用我们的布局：

public class MainActivity extends Activity {
 
@Override
protected void onCreate(Bundle savedInstanceState) {
 
super.onCreate(savedInstanceState);
setContentView(R.layout.detail);
 
}

我们的屏幕还没有准备好显示。自定义外观TextViews的主要思想是在每个保存TextView元素的TableRow上设置自定义 背景。

此外，您可以注意到，对于单行TextView，父TableRow背景设置为@ drawable / rounded_edittext，对于多行TextView，其中预期多于一行文本，父TableRow的背景设置为@ drawable / multitext_top和@ drawable / multitext_bottom。

让我们创建我们的drawables，以使整个事情发挥作用。

在res / drawable文件夹中，创建文件rounded_edittext.xml，它应如下所示：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
 
<item>
<shape
android:shape="rectangle" >
<solid android:color="@color/DEFAULT" />
<corners
android:bottomLeftRadius="7dp"
android:bottomRightRadius="7dp"
android:topLeftRadius="7dp"
android:topRightRadius="7dp" />
</shape>
</item>
<item android:bottom="1px">
<shape
android:padding="10dp"
android:shape="rectangle" >
<solid android:color="@color/DEFAULT" />
 
<stroke
android:width="1dip"
android:color="@color/borderGrey" />
 
<corners
android:bottomLeftRadius="5dp"
android:bottomRightRadius="5dp"
android:topLeftRadius="5dp"
android:topRightRadius="5dp" />
</shape>
</item>
 
</layer-list>

基本上，我们正在定义一些图层列表，目的是在底部有很少的“阴影”。在顶层，我们定义了矩形的项目，并且我们还定义了该矩形的角，以半径7dp进行舍入。

底层用于某种阴影和通知，它被定义为1px的底部值，以便从顶层移动到底部1px。

对于multitext_top和multitext_bottom xml文件，源代码如下所示：

<!-- multitext_top.xml -->
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
 
<item android:bottom="-1dp">
<shape
android:padding="10dp"
android:shape="rectangle" >
<solid android:color="@color/DEFAULT" />
 
<stroke
android:width="1dip"
android:color="@color/borderGrey" />
 
<corners
android:bottomLeftRadius="1dp"
android:bottomRightRadius="1dp"
android:topLeftRadius="5dp"
android:topRightRadius="5dp" />
</shape>
</item>
 
</layer-list>

<!-- multitext_bottom.xml -->
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
 
<item android:bottom="1px">
<shape
android:padding="10dp"
android:shape="rectangle" >
<solid android:color="@color/DEFAULT" />
 
<stroke
android:width="1dip"
android:color="@color/borderGrey" />
 
<corners
android:bottomLeftRadius="5dp"
android:bottomRightRadius="5dp"
android:topLeftRadius="1dp"
android:topRightRadius="1dp" />
</shape>
</item>
 
</layer-list>

这个单独的drawables的主要目的是给顶部TextView的圆角顶角和底部TextView的底角。

当然，不要忘记在res / values / styles.xml中定义文本样式：

<?xml version="1.0" encoding="utf-8"?>
<resources>
 
<style name="BoldText">
<item name="android:textColor">#222222</item>
<item name="android:textStyle">bold</item>
<item name="android:textSize">18sp</item>
<item name="android:typeface">normal</item>
</style>
 
<style name="ListRowBottomText">
<item name="android:textColor">#696969</item>
<item name="android:textStyle">normal</item>
<item name="android:textSize">14sp</item>
<item name="android:typeface">normal</item>
</style>
 
<style name="SettingsRightText">
<item name="android:textColor">#2F2F2F</item>
<item name="android:textStyle">normal</item>
<item name="android:textSize">16sp</item>
<item name="android:typeface">normal</item>
</style>
 
<style name="SettingsDescriptionText">
<item name="android:textColor">#696969</item>
<item name="android:textStyle">normal</item>
<item name="android:textSize">11sp</item>
<item name="android:typeface">normal</item>
</style>
 
<style name="DetailRightText">
<item name="android:textColor">#4D6693</item>
<item name="android:textStyle">normal</item>
<item name="android:textSize">18sp</item>
<item name="android:typeface">normal</item>
</style>
 
<style name="ButtonText">
<item name="android:textColor">#0F0F0F</item>
<item name="android:textStyle">normal</item>
<item name="android:textSize">18sp</item>
<item name="android:typeface">normal</item>
</style>
 
<style name="DetailMessageText">
<item name="android:textColor">#808080</item>
<item name="android:textStyle">normal</item>
<item name="android:textSize">14sp</item>
<item name="android:typeface">normal</item>
</style>
 
<style name="SplashScreen">
<item name="android:padding">0dp</item>
<item name="android:windowBackground">@drawable/splash</item>
<item name="android:windowFrame">@null</item>
<item name="android:windowFullscreen">true</item>
<item name="android:windowNoTitle">true</item>
</style>
 
</resources>

颜色在res / values / colors.xml中定义：

<?xml version="1.0" encoding="utf-8"?>
<resources>
 
<color name="EMERG">#FF0000</color>
<color name="ALERT">#E47297</color>
<color name="CRIT">#F1433F</color>
<color name="ERR">#336699</color>
<color name="WARN">#F7E967</color>
<color name="NOTICE">#A9CF54</color>
<color name="INFO">#70B7BA</color>
<color name="DEBUG">#FF6600</color>
<color name="DEFAULT">#FFFFFF</color>
<color name="backgroundGrey">#C5CCD4</color>
<color name="borderGrey">#A1A7AE</color>
<color name="boldtext">#000000</color>
<color name="white">#fff</color>
<color name="purple_start">#9b256b</color>
<color name="purple_end">#5d2761</color>
 
<color name="normal">#b0b0b0</color>
<color name="light">#ffffff</color>
<color name="dark">#000000</color>
<color name="highlight">#38c0f4</color>
<color name="black">#000000</color>
 
<color name="search_focused">#96C03D</color>
 
</resources>

本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。