Android UI项目一: 商家信息应用
1.项目简介
设计并实现一款单屏应用,用来显示关于一家虚拟小型商家的信息。本小项目中就是一个书城的小页面。
2.作品展示
3.需要掌握的知识
- xml 布局
- 利用 LinearLayout 和 RelativeLayout 布局
- 控制字体和视图大小的 sp 和 dp 单位
- TextView 和 ImageView 两个控件的运用
4.知识代码详解
1.思路:首先对于页面的拆分到底是用相对还是绝对布局,本例中采用相对布局较为灵活些也可以混合使用。RelativeLayout的属性先来介绍主要分为三大部分:
(1)相对于父布局的:alignParent定位在父布局中的上下左右中;
(2)相对于控件布局的:toRightOf引用控件id就可以,控件注意定义的先后顺序;
(3)进行控件的对齐布局的:alignLeft相对控件的左侧对齐,上下对齐;
2.ImageView的放大属性使用:android:scaleType="centerCrop" 是按比例扩大图片的size居中显示,使得图片长(宽)等于或大于View的长(宽),不会直接裁剪和原图不一致的。
3.Intent的使用:进行跳转先要在manifest文件中注册,然后创建意图对象进行跳转,这里使用的显式意图跳转,还能传输数据到下个activity中,下个activity获得上一个意图对象调用getExtra方法就可以
Intent intent = new Intent(MainActivity.this,Zhongshuge.class);
intent.putExtra("data","这是给杭州钟书阁的");
startActivity(intent);
Toast.makeText(MainActivity.this,"you had into zhongshuge!",Toast.LENGTH_SHORT).show();
4.整个项目的源码
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.kevin.abnd_shop_info.MainActivity">
<ImageView
android:id="@+id/image_view1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="@drawable/p1" />
<TextView
android:id="@+id/title_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:text="@string/title"
android:background="#40000000"
android:textColor="@android:color/primary_text_dark"
android:textSize="24sp" />
<TextView
android:id="@+id/summary_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/title_text_view"
android:layout_margin="8dp"
android:background="#40000000"
android:text="@string/summary"
android:textColor="@android:color/background_light" />
<ImageView
android:id="@+id/image_view2"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_below="@+id/address_text_view"
android:layout_alignRight="@id/address_text_view"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="16dp"
android:scaleType="centerCrop"
android:src="@drawable/p2" />
<TextView
android:id="@+id/time_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="@id/address_text_view"
android:layout_alignParentBottom="true"
android:paddingBottom="16dp"
android:paddingLeft="8dp"
android:paddingRight="8dp"
android:paddingTop="8dp"
android:background="#40000000"
android:text="@string/time"
android:textColor="@android:color/background_light" />
<TextView
android:id="@+id/phone_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@id/time_text_view"
android:layout_alignLeft="@id/address_text_view"
android:padding="8dp"
android:text="@string/phone"
android:background="#40000000"
android:textColor="@android:color/background_light" />
<TextView
android:id="@+id/address_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@id/phone_text_view"
android:layout_alignParentRight="true"
android:padding="8dp"
android:background="#40000000"
android:text="@string/address"
android:textColor="@android:color/background_light" />
</RelativeLayout>
public class MainActivity extends AppCompatActivity {
//小的图片
private ImageView imageView2;
//大的背景图
private ImageView imageView1;
public MainActivity() {
super();
}
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
imageView2 = (ImageView)findViewById(R.id.image_view2);
imageView1 = (ImageView)findViewById(R.id.image_view1);
imageView2.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//intent数据的传输传输和回传
Intent intent = new Intent(MainActivity.this,Zhongshuge.class);
intent.putExtra("data","这是给杭州钟书阁的");
startActivity(intent);
Toast.makeText(MainActivity.this,"you had into zhongshuge!",Toast.LENGTH_SHORT).show();
}
});
imageView1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//进行数据回传
Intent intent = new Intent(MainActivity.this,Zhongshuge.class);
//请求码是1,作为一个标记使用的额
startActivityForResult(intent,1);
}
});
5.反思总结
- 学会使用Google搜索,程序员必备,走出舒适区加强对英文的阅读能力,对于自己的英文不熟悉,要硬逼自己,坚持下去阅读官方文档。
- 每段时间的学习规划好,安排好任务和目标,不给自己设限,试想着实现些其他功能。
- 博客书写,提升执行力,每天感觉进步一点点,从菜鸟开始起飞!PS:从上床不带手机开始,早睡早起提升效率。
github学习成长博客