当前位置:网站首页>Harmonyos application development -- address book management system telmanagesys based on listcontainer [phonebook][api v6]
Harmonyos application development -- address book management system telmanagesys based on listcontainer [phonebook][api v6]
2022-07-06 14:18:00 【TDTX】
HarmonyOS application development -- be based on ListContainer Address book management system TelManageSys[ telephone book ][API V6]
- 1. name
- 2. Function description
- 3. app Key skills to achieve
- 4. Source code
- 4.0 Project file structure
- 4.1 Java Code
- 4.2 XML Code
- 4.2.1 UI background XML
- 4.2.1.1 background_ability_main.xml
- 4.2.1.2 background_bottombutton.xml
- 4.2.1.3 background_ddl1.xml
- 4.2.1.4 background_ddl2.xml
- 4.2.1.5 background_ddl3.xml
- 4.2.1.6 background_edit_addbutton.xml
- 4.2.1.7 background_edit_addnametext.xml
- 4.2.1.8 background_edit_addtfd.xml
- 4.2.1.9 background_edit_topbut.xml
- 4.2.1.10 background_listcontainer_item.xml
- 4.2.1.11 background_people_listcontainer.xml
- 4.2.1.12 background_searchbutton.xml
- 4.2.1.13 background_searchtextfield.xml
- 4.2.2 Main page and sub layout XML
- 4.2.2.1 ability_config.xml
- 4.2.2.2 ability_config_topsublayout.xml
- 4.2.2.3 ability_edit.xml
- 4.2.2.4 ability_edit_addresssublayout.xml
- 4.2.2.5 ability_edit_emailsublayout.xml
- 4.2.2.6 ability_edit_telsublayout.xml
- 4.2.2.7 ability_edit_topsublayout.xml
- 4.2.2.8 ability_edit_worksublayout.xml
- 4.2.2.9 ability_listcontainer_itemlayout
- 4.2.2.10 ability_main.xml
- 4.2.2.11 ability_people_listcontainerlayout.xml
- 4.2.2.12 ability_persondetail.xml
- 4.2.2.13 ability_search_topsublayout.xml
- 5. app Screenshot ( The remote simulator runs )
- 6. app Run the video ( Remote real machine debugging and running )
1. name
This time is mainly based on ListContainer Our address book management system is named : telephone book 、TelManageSys.
This project is also placed in Gitee Warehouse :TelManageSys
app The icons are as follows :
2. Function description
- Have the ability to display contact list 、 Add contact information 、 Delete contact information 、 Modify contact information 、 The main functions of searching contact information .
- When operating in key steps , With performance Toast Tips and CommDialog Window confirmation function .
- With data storage function , But not through database operation , Instead, use the configuration file to write the corresponding data , And read and modify .
- In settings , It has the selection function of switching the color of the bottom navigation bar .
3. app Key skills to achieve
- Realize switching pages through the bottom button : Divide a page into upper 、 in 、 The next three parts , One of them 、 Dynamic loading is required in XML The layout technology loads the corresponding layout by clicking different bottom navigation buttons , Achieve the effect of switching pages , This is a navigation page switching method introduced in this column , There are other skills introduced later .
- Realize the switching of the bottom color theme : Summarize the color matching at the bottom into four Rgb Color matching , It must be stored in BottomBarColor.java In file , Keep it static/final, And write corresponding static Function operation . When the user selects a theme color and clicks “ application ” After button , Will call to set the corresponding color , To achieve the purpose of switching color !
- Realize data storage : This project has not used database operation , Instead, use configuration files to store data directly . among , Store contact names in a contact list file , Each contact has a separate file with its name as the file name, which is stored as personal information ! When you need to delete a contact , First, take out all the contents of the contact list file , Then remove the contact to be deleted , Finally, write the new personnel list information into the file , Synchronously delete the personal information file of this contact .
- when edited , Achieve click “+” Add an input box , Click on “-” Reduce one input field : The method of realizing this function is also inseparable XML Dynamic loading technology of files , But you need to load after the specified component , To achieve the purpose of clicking the plus sign to add a line . Reduce one line , Just remove the specified components from the layout .
- when edited , Only enter the name , The confirm button will appear : To achieve this , Just check whether the content in the name input box is empty , If it's empty , Then hide the component , If it is not empty, set the component to be visible , The purpose of this operation can be achieved !
4. Source code
4.0 Project file structure
4.1 Java Code
4.1.1 BottomBarColor.java
package com.tdtxdcxm.telmanagesys.configcolor;
import ohos.agp.colors.RgbColor;
import ohos.agp.components.DirectionalLayout;
import ohos.agp.components.element.ShapeElement;
import ohos.agp.render.ColorMatrix;
public class BottomBarColor {
public static void setBottomBarColor(DirectionalLayout ddl3,int i){
switch (i){
case 0:
ddl3.setBackground(BottomBarColor.defaultShapeElement());
break;
case 1:
ddl3.getBackgroundElement().setColorMatrix(new ColorMatrix(BottomBarColor.darkcolor));
break;
case 2:
ddl3.getBackgroundElement().setColorMatrix(new ColorMatrix(BottomBarColor.lightcolor));
break;
case 3:
ddl3.getBackgroundElement().setColorMatrix(new ColorMatrix(BottomBarColor.simplecolor));
break;
default:
break;
}
}
public static ShapeElement defaultShapeElement(){
ShapeElement shapeElement = new ShapeElement();
RgbColor rgbColor = new RgbColor();
rgbColor.setRed(255);
rgbColor.setGreen(255);
rgbColor.setBlue(255);
rgbColor.setAlpha(28);
shapeElement.setRgbColor(rgbColor);
rgbColor.setRed(139);
rgbColor.setGreen(69);
rgbColor.setBlue(19);
rgbColor.setAlpha(100);
shapeElement.setStroke(9,rgbColor);
shapeElement.setCornerRadius(50);
return shapeElement;
}
//CornflowerBlue The blue of cornflower #6495ED 100,149,237
public static final float[] onclickfloats = {
0,0,0,0,100,
0,0,0,0,149,
0,0,0,0,237,
0,0,0,0,80};
public static final float[] darkcolor = {
0, 0, 0, 0, 47,
0, 0, 0, 0, 79,
0, 0, 0, 0, 79,
0, 0, 0, 0, 90
};
public static final float[] lightcolor = {
0, 0, 0, 0, 175,
0, 0, 0, 0, 238,
0, 0, 0, 0, 238,
0, 0, 0, 0, 100
};
public static final float[] simplecolor = {
0, 0, 0, 0, 221,
0, 0, 0, 0, 219,
0, 0, 0, 0, 219,
0, 0, 0, 0, 28
};
private BottomBarColor(){
}
}
4.1.2 PeopleItem.java
package com.tdtxdcxm.telmanagesys.itemdata;
public class PeopleItem {
private String name;
public PeopleItem(String name) {
this.name = name;
}
public void setName(String name){
this.name = name;
}
public String getName(){
System.out.println("getName--->name:"+name);
return name;
}
@Override
public String toString(){
return " Contacts {"+" full name :"+name+"}";
}
}
4.1.3 PeopleItemProvider.java
package com.tdtxdcxm.telmanagesys.provider;
import com.tdtxdcxm.telmanagesys.ResourceTable;
import com.tdtxdcxm.telmanagesys.itemdata.PeopleItem;
import ohos.aafwk.ability.AbilitySlice;
import ohos.agp.components.*;
import java.util.List;
public class PeopleItemProvider extends BaseItemProvider {
private List<PeopleItem> list;
private AbilitySlice slice;
public PeopleItemProvider(List<PeopleItem> list, AbilitySlice slice) {
this.list = list;
this.slice = slice;
}
@Override
public int getCount() {
return list != null?list.size():0;
}
@Override
public Object getItem(int i) {
if(list == null || (i < 0 || i >= list.size())){
return null;
}
return list.get(i);
}
@Override
public long getItemId(int i) {
return i;
}
@Override
public Component getComponent(int i, Component component, ComponentContainer componentContainer) {
final Component cmpt;
if(component == null){
cmpt = LayoutScatter.getInstance(slice).parse(ResourceTable.Layout_ability_listcontainer_itemlayout,null,false);
}
else{
cmpt = component;
}
PeopleItem peopleItem = list.get(i);
Text text = (Text) cmpt.findComponentById(ResourceTable.Id_item_text);
text.setText(peopleItem.getName());
return cmpt;
}
}
4.1.4 MainAbilitySlice.java
package com.tdtxdcxm.telmanagesys.slice;
import com.tdtxdcxm.telmanagesys.PeopleInfoConfig;
import com.tdtxdcxm.telmanagesys.ResourceTable;
import com.tdtxdcxm.telmanagesys.configcolor.BottomBarColor;
import com.tdtxdcxm.telmanagesys.itemdata.PeopleItem;
import com.tdtxdcxm.telmanagesys.provider.PeopleItemProvider;
import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.colors.RgbColor;
import ohos.agp.components.*;
import ohos.agp.components.element.Element;
import ohos.agp.components.element.ShapeElement;
import ohos.agp.render.ColorMatrix;
import ohos.agp.utils.Color;
import ohos.agp.utils.LayoutAlignment;
import ohos.agp.window.dialog.ToastDialog;
import java.util.ArrayList;
import java.util.List;
public class MainAbilitySlice extends AbilitySlice {
private int idbut = -1;
private int i = 0;
private DirectionalLayout search_top_sublayout;
private TextField search_tfd;
private Button search_but;
private DirectionalLayout edit_top_sublayout;
private Button edit_deletebut,edit_resetbut,edit_okbut;
private DirectionalLayout config_top_sublayout;
private Button config_deletebut,config_resetbut,config_okbut;
private DirectionalLayout people_listcontainer_sublayout;
private ListContainer people_listcontainer;
private List<PeopleItem> list = new ArrayList<>();
private DirectionalLayout edit_area_rootdl;
private Text edit_nametext;
private Button edit_addtel_but,edit_addemail_but,edit_addwork_but,edit_addaddress_but;
private TextField edit_nametfd,edit_teltfd,edit_emailtfd,edit_worktfd,edit_addresstfd;
private DirectionalLayout config_area_rootdl;
private RadioContainer config_radioContainer;
private RadioButton bottombar_default,bottombar_dark,bottombar_light,bottombar_simple;
private DirectionalLayout main_rootdl_ddl1;
private DirectionalLayout main_rootdl_ddl2;
private DirectionalLayout main_rootdl_ddl3;
private Button ddl3_butpeople,ddl3_butedit,ddl3_butconfig;
public void initAndLoadSearch(DirectionalLayout ddl1){
ddl1.removeAllComponents();
search_top_sublayout = (DirectionalLayout) LayoutScatter.getInstance(this).parse(ResourceTable.Layout_ability_search_topsublayout,null,false);
search_tfd = (TextField) search_top_sublayout.findComponentById(ResourceTable.Id_search_tfd);
search_but = (Button) search_top_sublayout.findComponentById(ResourceTable.Id_search_but);
/*<************************* Set listeners for input boxes and search buttons ****************************/
search_tfd.setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
}
});
search_but.setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
search_tfd.clearFocus();
Intent intent = new Intent();
intent.setParam(" full name ",search_tfd.getText());
present(new PersonDetailSlice(),intent);
}
});
/**************************** Set listeners for input boxes and search buttons **************************>*/
ddl1.addComponent(search_top_sublayout);
}
public void initAndLoadEditTop(DirectionalLayout ddl1){
ddl1.removeAllComponents();
edit_top_sublayout = (DirectionalLayout) LayoutScatter.getInstance(this).parse(ResourceTable.Layout_ability_edit_topsublayout,null,false);
edit_deletebut = (Button) edit_top_sublayout.findComponentById(ResourceTable.Id_edit_deletebut);
edit_resetbut = (Button) edit_top_sublayout.findComponentById(ResourceTable.Id_edit_resetbut);
edit_okbut = (Button) edit_top_sublayout.findComponentById(ResourceTable.Id_edit_okbut);
edit_okbut.setVisibility(Component.HIDE);
/*<************************* Set listeners for the three function buttons ****************************/
edit_deletebut.setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
edit_nametfd.setText("");
edit_nametfd.clearFocus();
edit_nametext.setText(" To be input ");
edit_teltfd.setText("");
edit_teltfd.clearFocus();
DirectionalLayout edit_telanother_rootdl = (DirectionalLayout) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_telanother_rootdl);
if(edit_telanother_rootdl != null){
((TextField)edit_telanother_rootdl.findComponentById(ResourceTable.Id_edit_telanother_teltfd)).setText("");
((TextField)edit_telanother_rootdl.findComponentById(ResourceTable.Id_edit_telanother_teltfd)).clearFocus();
}
edit_emailtfd.setText("");
edit_emailtfd.clearFocus();
DirectionalLayout edit_emailanother_rootdl = (DirectionalLayout) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_emailanother_rootdl);
if(edit_emailanother_rootdl != null){
((TextField)edit_emailanother_rootdl.findComponentById(ResourceTable.Id_edit_emailanother_emailtfd)).setText("");
((TextField)edit_emailanother_rootdl.findComponentById(ResourceTable.Id_edit_emailanother_emailtfd)).clearFocus();
}
edit_worktfd.setText("");
edit_worktfd.clearFocus();
DirectionalLayout edit_workanother_rootdl = (DirectionalLayout) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_workanother_rootdl);
if(edit_workanother_rootdl != null){
((TextField) edit_workanother_rootdl.findComponentById(ResourceTable.Id_edit_workanother_worktfd)).setText("");
((TextField) edit_workanother_rootdl.findComponentById(ResourceTable.Id_edit_workanother_worktfd)).clearFocus();
}
edit_addresstfd.setText("");
edit_addresstfd.clearFocus();
DirectionalLayout edit_addressanother_rootdl = (DirectionalLayout) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_addressanother_rootdl);
if(edit_addressanother_rootdl != null){
((TextField) edit_addressanother_rootdl.findComponentById(ResourceTable.Id_edit_addressanother_addresstfd)).setText("");
((TextField) edit_addressanother_rootdl.findComponentById(ResourceTable.Id_edit_addressanother_addresstfd)).clearFocus();
}
toastShow(" Emptied !");
}
});
edit_resetbut.setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
DirectionalLayout edit_telanother_rootdl = (DirectionalLayout) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_telanother_rootdl);
if(edit_telanother_rootdl != null){
edit_area_rootdl.removeComponent(edit_telanother_rootdl);
edit_addtel_but.setText("+");
edit_addtel_but.setTextColor(Color.GREEN);
}
DirectionalLayout edit_emailanother_rootdl = (DirectionalLayout) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_emailanother_rootdl);
if(edit_emailanother_rootdl != null){
edit_area_rootdl.removeComponent(edit_emailanother_rootdl);
edit_addemail_but.setText("+");
edit_addemail_but.setTextColor(Color.GREEN);
}
DirectionalLayout edit_workanother_rootdl = (DirectionalLayout) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_workanother_rootdl);
if(edit_workanother_rootdl != null){
edit_area_rootdl.removeComponent(edit_workanother_rootdl);
edit_addwork_but.setText("+");
edit_addwork_but.setTextColor(Color.GREEN);
}
DirectionalLayout edit_addressanother_rootdl = (DirectionalLayout) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_addressanother_rootdl);
if(edit_addressanother_rootdl != null){
edit_area_rootdl.removeComponent(edit_addressanother_rootdl);
edit_addaddress_but.setText("+");
edit_addaddress_but.setTextColor(Color.GREEN);
}
toastShow(" Reset !");
}
});
edit_okbut.setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
String[] personinfo = new String[9];
personinfo[0] = edit_nametfd.getText();
personinfo[1] = edit_teltfd.getText();
DirectionalLayout edit_telanother_rootdl = (DirectionalLayout) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_telanother_rootdl);
if(edit_telanother_rootdl != null){
personinfo[2] = ((TextField)edit_telanother_rootdl.findComponentById(ResourceTable.Id_edit_telanother_teltfd)).getText();
}
else{
personinfo[2] = "";
}
personinfo[3] = edit_emailtfd.getText();
DirectionalLayout edit_emailanother_rootdl = (DirectionalLayout) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_emailanother_rootdl);
if(edit_emailanother_rootdl != null){
personinfo[4] = ((TextField)edit_emailanother_rootdl.findComponentById(ResourceTable.Id_edit_emailanother_emailtfd)).getText();
}
else{
personinfo[4] = "";
}
personinfo[5] = edit_worktfd.getText();
DirectionalLayout edit_workanother_rootdl = (DirectionalLayout) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_workanother_rootdl);
if(edit_workanother_rootdl != null){
personinfo[6] = ((TextField) edit_workanother_rootdl.findComponentById(ResourceTable.Id_edit_workanother_worktfd)).getText();
}
else{
personinfo[6] = "";
}
personinfo[7] = edit_addresstfd.getText();
DirectionalLayout edit_addressanother_rootdl = (DirectionalLayout) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_addressanother_rootdl);
if(edit_addressanother_rootdl != null){
personinfo[8] = ((TextField) edit_addressanother_rootdl.findComponentById(ResourceTable.Id_edit_addressanother_addresstfd)).getText();
}
else{
personinfo[8] = "";
}
PeopleInfoConfig.writeData(MainAbilitySlice.this.getContext(),personinfo);
ddl3_butpeople.getClickedListener().onClick(ddl3_butpeople);
}
});
/*************************** Set listeners for the three function buttons **************************>*/
ddl1.addComponent(edit_top_sublayout);
}
public void initAndLoadConfigTop(DirectionalLayout ddl1){
ddl1.removeAllComponents();
config_top_sublayout = (DirectionalLayout) LayoutScatter.getInstance(this).parse(ResourceTable.Layout_ability_config_topsublayout,null,false);
config_resetbut = (Button) config_top_sublayout.findComponentById(ResourceTable.Id_config_resetbut);
config_okbut = (Button) config_top_sublayout.findComponentById(ResourceTable.Id_config_okbut);
/*<***************************** Set listeners for the three function buttons *************************************/
config_resetbut.setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
RadioContainer radioContainer = (RadioContainer) main_rootdl_ddl2.findComponentById(ResourceTable.Id_config_radioContainer);
if(radioContainer != null){
radioContainer.mark(0);
BottomBarColor.setBottomBarColor(main_rootdl_ddl3,MainAbilitySlice.this.i);
}
}
});
config_okbut.setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
BottomBarColor.setBottomBarColor(main_rootdl_ddl3,MainAbilitySlice.this.i);
toastShow(" Have been set : The first "+(MainAbilitySlice.this.i+1)+" Themes !");
}
});
/****************************** Set listeners for the three function buttons ***********************************>*/
ddl1.addComponent(config_top_sublayout);
}
public void toastShow(String s){
ToastDialog toastDialog = new ToastDialog(this.getContext());
toastDialog.setText(s);
toastDialog.setTransparent(true);
toastDialog.setDuration(500);
toastDialog.setAlignment(LayoutAlignment.CENTER);
toastDialog.show();
}
public void installListContainer(DirectionalLayout ddl2){
System.out.println(" Start loading listcontainer!!");
ddl2.removeAllComponents();
people_listcontainer_sublayout = (DirectionalLayout) LayoutScatter.getInstance(this).parse(ResourceTable.Layout_ability_people_listcontainerlayout,null,false);
people_listcontainer = (ListContainer) people_listcontainer_sublayout.findComponentById(ResourceTable.Id_people_listcontainer);
ddl2.addComponent(people_listcontainer_sublayout);
}
public void initListContainer(){
System.out.println(" Start reading data !");
PeopleInfoConfig.readData(this.getContext(),list);
PeopleItemProvider peopleItemProvider = new PeopleItemProvider(list,this);
people_listcontainer.setItemProvider(peopleItemProvider);
people_listcontainer.setItemClickedListener(new ListContainer.ItemClickedListener() {
@Override
public void onItemClicked(ListContainer listContainer, Component component, int i, long l) {
Text item_text = (Text) component.findComponentById(ResourceTable.Id_item_text);
if(item_text.getText().equals(" Please add a contact ") == false){
Intent intent = new Intent();
intent.setParam(" full name ",item_text.getText());
present(new PersonDetailSlice(),intent);
}
else{
toastShow(" There is no contact information in the address book !");
}
}
});
people_listcontainer.setItemLongClickedListener(new ListContainer.ItemLongClickedListener() {
@Override
public boolean onItemLongClicked(ListContainer listContainer, Component component, int i, long l) {
Text item_text = (Text) component.findComponentById(ResourceTable.Id_item_text);
item_text.setTextColor(Color.RED);
PeopleInfoConfig.deleteData(MainAbilitySlice.this.getContext(),item_text.getText());
PeopleInfoConfig.readData(MainAbilitySlice.this.getContext(),list);
peopleItemProvider.notifyDataChanged();
return true;
}
});
}
public void installEditArea(DirectionalLayout ddl2){
ddl2.removeAllComponents();
edit_area_rootdl = (DirectionalLayout) LayoutScatter.getInstance(this).parse(ResourceTable.Layout_ability_edit,null,false);
edit_nametext = (Text) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_nametext);
edit_addtel_but = (Button) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_addtel_but);
edit_addemail_but = (Button) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_addemail_but);
edit_addwork_but = (Button) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_addwork_but);
edit_addaddress_but = (Button) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_addaddress_but);
edit_nametfd = (TextField) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_nametfd);
edit_teltfd = (TextField) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_teltfd);
edit_emailtfd = (TextField) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_emailtfd);
edit_worktfd = (TextField) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_worktfd);
edit_addresstfd = (TextField) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_addresstfd);
/*<********************************** Set text monitoring for the text box of the input name ***********************************/
edit_nametfd.addTextObserver(new Text.TextObserver() {
@Override
public void onTextUpdated(String s, int i, int i1, int i2) {
edit_nametext.setText(s);
if(s.equals("")){
edit_okbut.setVisibility(Component.HIDE);
edit_okbut.setText(" confirm ");
}
else{
edit_okbut.setVisibility(Component.VISIBLE);
}
}
});
/************************************ Set text monitoring for the text box of the input name *********************************>*/
/*<**************************** Set up listeners for the four add buttons ******************************************/
edit_addtel_but.setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
if(edit_addtel_but.getText().equals("-")){
DirectionalLayout edit_telanother_rootdl = (DirectionalLayout) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_telanother_rootdl);
edit_area_rootdl.removeComponent(edit_telanother_rootdl);
edit_addtel_but.setText("+");
edit_addtel_but.setTextColor(Color.GREEN);
return;
}
DirectionalLayout edit_tel_dlyt = (DirectionalLayout) findComponentById(ResourceTable.Id_edit_tel_dlyt);
DirectionalLayout edit_telanother_rootdl = (DirectionalLayout) LayoutScatter.getInstance(MainAbilitySlice.this).parse(ResourceTable.Layout_ability_edit_telsublayout,null,false);
int i = edit_area_rootdl.getChildIndex(edit_tel_dlyt);
System.out.println("edit_area_rootdl.getChildCount()-->"+edit_area_rootdl.getChildCount());
edit_area_rootdl.addComponent(edit_telanother_rootdl,i+1);
edit_addtel_but.setText("-");
edit_addtel_but.setTextColor(Color.RED);
}
});
edit_addemail_but.setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
if(edit_addemail_but.getText().equals("-")){
DirectionalLayout edit_emailanother_rootdl = (DirectionalLayout) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_emailanother_rootdl);
edit_area_rootdl.removeComponent(edit_emailanother_rootdl);
edit_addemail_but.setText("+");
edit_addemail_but.setTextColor(Color.GREEN);
return;
}
DirectionalLayout edit_email_dlyt = (DirectionalLayout) findComponentById(ResourceTable.Id_edit_email_dlyt);
DirectionalLayout edit_emailanother_rootdl = (DirectionalLayout) LayoutScatter.getInstance(MainAbilitySlice.this).parse(ResourceTable.Layout_ability_edit_emailsublayout,null,false);
int i = edit_area_rootdl.getChildIndex(edit_email_dlyt);
System.out.println("edit_area_rootdl.getChildCount()-->"+edit_area_rootdl.getChildCount());
edit_area_rootdl.addComponent(edit_emailanother_rootdl,i+1);
edit_addemail_but.setText("-");
edit_addemail_but.setTextColor(Color.RED);
}
});
edit_addwork_but.setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
if(edit_addwork_but.getText().equals("-")){
DirectionalLayout edit_workanother_rootdl = (DirectionalLayout) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_workanother_rootdl);
edit_area_rootdl.removeComponent(edit_workanother_rootdl);
edit_addwork_but.setText("+");
edit_addwork_but.setTextColor(Color.GREEN);
return;
}
DirectionalLayout edit_work_dlyt = (DirectionalLayout) findComponentById(ResourceTable.Id_edit_work_dlyt);
DirectionalLayout edit_workanother_rootdl = (DirectionalLayout) LayoutScatter.getInstance(MainAbilitySlice.this).parse(ResourceTable.Layout_ability_edit_worksublayout,null,false);
int i = edit_area_rootdl.getChildIndex(edit_work_dlyt);
System.out.println("edit_area_rootdl.getChildCount()-->"+edit_area_rootdl.getChildCount());
edit_area_rootdl.addComponent(edit_workanother_rootdl,i+1);
edit_addwork_but.setText("-");
edit_addwork_but.setTextColor(Color.RED);
}
});
edit_addaddress_but.setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
if(edit_addaddress_but.getText().equals("-")){
DirectionalLayout edit_addressanother_rootdl = (DirectionalLayout) edit_area_rootdl.findComponentById(ResourceTable.Id_edit_addressanother_rootdl);
edit_area_rootdl.removeComponent(edit_addressanother_rootdl);
edit_addaddress_but.setText("+");
edit_addaddress_but.setTextColor(Color.GREEN);
return;
}
DirectionalLayout edit_address_dlyt = (DirectionalLayout) findComponentById(ResourceTable.Id_edit_address_dlyt);
DirectionalLayout edit_addressanother_rootdl = (DirectionalLayout) LayoutScatter.getInstance(MainAbilitySlice.this).parse(ResourceTable.Layout_ability_edit_addresssublayout,null,false);
int i = edit_area_rootdl.getChildIndex(edit_address_dlyt);
System.out.println("edit_area_rootdl.getChildCount()-->"+edit_area_rootdl.getChildCount());
edit_area_rootdl.addComponent(edit_addressanother_rootdl,i+1);
edit_addaddress_but.setText("-");
edit_addaddress_but.setTextColor(Color.RED);
}
});
/***************************** Set up listeners for the four add buttons ****************************************>*/
ddl2.addComponent(edit_area_rootdl);
}
public void installConfigArea(DirectionalLayout ddl2){
ddl2.removeAllComponents();
config_area_rootdl = (DirectionalLayout) LayoutScatter.getInstance(this).parse(ResourceTable.Layout_ability_config,null,false);
config_radioContainer = (RadioContainer) config_area_rootdl.findComponentById(ResourceTable.Id_config_radioContainer);
bottombar_default = (RadioButton) config_area_rootdl.findComponentById(ResourceTable.Id_bottombar_default);
bottombar_dark = (RadioButton) config_area_rootdl.findComponentById(ResourceTable.Id_bottombar_dark);
bottombar_light = (RadioButton) config_area_rootdl.findComponentById(ResourceTable.Id_bottombar_light);
bottombar_simple = (RadioButton) config_area_rootdl.findComponentById(ResourceTable.Id_bottombar_simple);
config_radioContainer.mark(MainAbilitySlice.this.i);
config_radioContainer.setMarkChangedListener(new RadioContainer.CheckedStateChangedListener() {
@Override
public void onCheckedChanged(RadioContainer radioContainer, int i) {
switch (i){
case 0:
toastShow(" choice :"+bottombar_default.getText());
MainAbilitySlice.this.i = i;
break;
case 1:
toastShow(" choice :"+bottombar_dark.getText());
MainAbilitySlice.this.i = i;
break;
case 2:
toastShow(" choice :"+bottombar_light.getText());
MainAbilitySlice.this.i = i;
break;
case 3:
toastShow(" choice :"+bottombar_simple.getText());
MainAbilitySlice.this.i = i;
break;
default:
break;
}
}
});
ddl2.addComponent(config_area_rootdl);
}
public void initMASliceComponents(){
main_rootdl_ddl1 = (DirectionalLayout) findComponentById(ResourceTable.Id_main_rootdl_ddl1);
main_rootdl_ddl2 = (DirectionalLayout) findComponentById(ResourceTable.Id_main_rootdl_ddl2);
main_rootdl_ddl3 = (DirectionalLayout) findComponentById(ResourceTable.Id_main_rootdl_ddl3);
ddl3_butpeople = (Button) findComponentById(ResourceTable.Id_ddl3_butpeople);
main_rootdl_ddl3.setBackground(BottomBarColor.defaultShapeElement());
ddl3_butpeople.getBackgroundElement().setColorMatrix(new ColorMatrix(BottomBarColor.onclickfloats));
idbut = ResourceTable.Id_ddl3_butpeople;
ddl3_butedit = (Button) findComponentById(ResourceTable.Id_ddl3_butedit);
ddl3_butconfig = (Button) findComponentById(ResourceTable.Id_ddl3_butconfig);
/*<************************* Give three navigation button listeners ****************************/
ddl3_butpeople.setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
if(idbut != ddl3_butpeople.getId()) {
Button button = (Button) findComponentById(idbut);
button.getBackgroundElement().setColorMatrix(new ColorMatrix(BottomBarColor.simplecolor));
ddl3_butpeople.getBackgroundElement().setColorMatrix(new ColorMatrix(BottomBarColor.onclickfloats));
idbut = ddl3_butpeople.getId();
initAndLoadSearch(main_rootdl_ddl1);
installListContainer(main_rootdl_ddl2);
initListContainer();
}
}
});
ddl3_butedit.setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
if(idbut != ddl3_butedit.getId()) {
Button button = (Button) findComponentById(idbut);
button.getBackgroundElement().setColorMatrix(new ColorMatrix(BottomBarColor.simplecolor));
ddl3_butedit.getBackgroundElement().setColorMatrix(new ColorMatrix(BottomBarColor.onclickfloats));
idbut = ddl3_butedit.getId();
initAndLoadEditTop(main_rootdl_ddl1);
installEditArea(main_rootdl_ddl2);
}
}
});
ddl3_butconfig.setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
if(idbut != ddl3_butconfig.getId()) {
Button button = (Button) findComponentById(idbut);
button.getBackgroundElement().setColorMatrix(new ColorMatrix(BottomBarColor.simplecolor));
ddl3_butconfig.getBackgroundElement().setColorMatrix(new ColorMatrix(BottomBarColor.onclickfloats));
idbut = ddl3_butconfig.getId();
initAndLoadConfigTop(main_rootdl_ddl1);
installConfigArea(main_rootdl_ddl2);
}
}
});
/*************************** Give three navigation button listeners **************************>*/
}
@Override
public void onStart(Intent intent) {
super.onStart(intent);
super.setUIContent(ResourceTable.Layout_ability_main);
System.out.println(" Here we go -----》》》》》》");
initMASliceComponents();
initAndLoadSearch(main_rootdl_ddl1);
installListContainer(main_rootdl_ddl2);
initListContainer();
}
@Override
protected void onInactive() {
super.onInactive();
}
@Override
public void onActive() {
super.onActive();
}
@Override
public void onForeground(Intent intent) {
super.onForeground(intent);
}
@Override
protected void onBackground() {
super.onBackground();
}
@Override
protected void onStop() {
super.onStop();
}
}
4.1.5 PersonDetailSlice.java
package com.tdtxdcxm.telmanagesys.slice;
import com.tdtxdcxm.telmanagesys.PeopleInfoConfig;
import com.tdtxdcxm.telmanagesys.ResourceTable;
import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.components.Button;
import ohos.agp.components.Component;
import ohos.agp.components.Text;
import ohos.agp.components.TextField;
import ohos.agp.utils.LayoutAlignment;
import ohos.agp.window.dialog.CommonDialog;
import ohos.agp.window.dialog.IDialog;
import ohos.agp.window.dialog.ToastDialog;
public class PersonDetailSlice extends AbilitySlice {
private Button persondetail_backbut,persondetail_nobut,persondetail_okeditbut;
private Text persondetail_nametext;
private TextField persondetail_teltfd,persondetail_teltfd2;
private TextField persondetail_emailtfd,persondetail_emailtfd2;
private TextField persondetail_worktfd,persondetail_worktfd2;
private TextField persondetail_addresstfd,persondetail_addresstfd2;
private boolean isssave = false;
public void toastShow(String s){
ToastDialog toastDialog = new ToastDialog(this.getContext());
toastDialog.setText(s);
toastDialog.setTransparent(true);
toastDialog.setDuration(1000);
toastDialog.setAlignment(LayoutAlignment.BOTTOM);
toastDialog.show();
}
public void commonDialogShow(String titletext,String contenttext){
CommonDialog commonDialog = new CommonDialog(this.getContext());
commonDialog.setTitleText(titletext);
commonDialog.setContentText(contenttext);
commonDialog.setAlignment(LayoutAlignment.CENTER);
commonDialog.setCornerRadius(20);
commonDialog.setSize(700,360);
commonDialog.setButton(1, " determine ", new IDialog.ClickedListener() {
@Override
public void onClick(IDialog iDialog, int i) {
commonDialog.destroy();
terminate();
}
});
commonDialog.setButton(2, " Cancel ", new IDialog.ClickedListener() {
@Override
public void onClick(IDialog iDialog, int i) {
commonDialog.destroy();
}
});
commonDialog.show();
}
public void initPDSilceComponents(String name){
persondetail_backbut = (Button) findComponentById(ResourceTable.Id_persondetail_backbut);
persondetail_nobut= (Button) findComponentById(ResourceTable.Id_persondetail_nobut);
persondetail_okeditbut = (Button) findComponentById(ResourceTable.Id_persondetail_okeditbut);
persondetail_nametext = (Text) findComponentById(ResourceTable.Id_persondetail_nametext);
persondetail_teltfd = (TextField) findComponentById(ResourceTable.Id_persondetail_teltfd);
persondetail_teltfd2 = (TextField) findComponentById(ResourceTable.Id_persondetail_teltfd2);
persondetail_emailtfd = (TextField) findComponentById(ResourceTable.Id_persondetail_emailtfd);
persondetail_emailtfd2 = (TextField) findComponentById(ResourceTable.Id_persondetail_emailtfd2);
persondetail_worktfd = (TextField) findComponentById(ResourceTable.Id_persondetail_worktfd);
persondetail_worktfd2 = (TextField) findComponentById(ResourceTable.Id_persondetail_worktfd2);
persondetail_addresstfd = (TextField) findComponentById(ResourceTable.Id_persondetail_addresstfd);
persondetail_addresstfd2 = (TextField) findComponentById(ResourceTable.Id_persondetail_addresstfd2);
String[] personinfo = PeopleInfoConfig.readPersonData(this.getContext(),name);
persondetail_nametext.setText(personinfo[0]);
persondetail_teltfd.setText(personinfo[1]);
persondetail_teltfd2.setText(personinfo[2]);
persondetail_emailtfd.setText(personinfo[3]);
persondetail_emailtfd2.setText(personinfo[4]);
persondetail_worktfd.setText(personinfo[5]);
persondetail_worktfd2.setText(personinfo[6]);
persondetail_addresstfd.setText(personinfo[7]);
persondetail_addresstfd2.setText(personinfo[8]);
persondetail_teltfd.setClickable(false);
persondetail_teltfd2.setClickable(false);
persondetail_emailtfd.setClickable(false);
persondetail_emailtfd2.setClickable(false);
persondetail_worktfd.setClickable(false);
persondetail_worktfd2.setClickable(false);
persondetail_addresstfd.setClickable(false);
persondetail_addresstfd2.setClickable(false);
persondetail_backbut.setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
if(isssave == false){
commonDialogShow(" return "," Not saved yet , Are you sure to quit? ?");
}
else{
commonDialogShow(" return "," It has been saved , Are you sure to quit? ?");
}
}
});
persondetail_nobut.setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
persondetail_okeditbut.setText(" edit ");
persondetail_teltfd.clearFocus();
persondetail_teltfd2.clearFocus();
persondetail_emailtfd.clearFocus();
persondetail_emailtfd2.clearFocus();
persondetail_worktfd.clearFocus();
persondetail_worktfd2.clearFocus();
persondetail_addresstfd.clearFocus();
persondetail_addresstfd2.clearFocus();
persondetail_teltfd.setClickable(false);
persondetail_teltfd2.setClickable(false);
persondetail_emailtfd.setClickable(false);
persondetail_emailtfd2.setClickable(false);
persondetail_worktfd.setClickable(false);
persondetail_worktfd2.setClickable(false);
persondetail_addresstfd.setClickable(false);
persondetail_addresstfd2.setClickable(false);
toastShow(" Exited editing !");
}
});
persondetail_okeditbut.setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
if(persondetail_okeditbut.getText().equals(" edit ") && personinfo[0].equals("") == false){
persondetail_teltfd.setClickable(true);
persondetail_teltfd2.setClickable(true);
persondetail_emailtfd.setClickable(true);
persondetail_emailtfd2.setClickable(true);
persondetail_worktfd.setClickable(true);
persondetail_worktfd2.setClickable(true);
persondetail_addresstfd.setClickable(true);
persondetail_addresstfd2.setClickable(true);
persondetail_okeditbut.setText(" preservation ");
isssave = false;
toastShow(" You can modify and edit !");
return;
}
if(persondetail_okeditbut.getText().equals(" preservation ")){
String[] tpersoninfo = new String[9];
tpersoninfo[0] = persondetail_nametext.getText();
tpersoninfo[1] = persondetail_teltfd.getText();
tpersoninfo[2] = persondetail_teltfd2.getText();
tpersoninfo[3] = persondetail_emailtfd.getText();
tpersoninfo[4] = persondetail_emailtfd2.getText();
tpersoninfo[5] = persondetail_worktfd.getText();
tpersoninfo[6] = persondetail_worktfd2.getText();
tpersoninfo[7] = persondetail_addresstfd.getText();
tpersoninfo[8] = persondetail_addresstfd2.getText();
PeopleInfoConfig.writePersonData(PersonDetailSlice.this.getContext(),tpersoninfo);
persondetail_okeditbut.setText(" edit ");
persondetail_nobut.getClickedListener().onClick(persondetail_nobut);
isssave = true;
toastShow(" It has been saved !");
}
}
});
}
@Override
public void onStart(Intent intent) {
super.onStart(intent);
super.setUIContent(ResourceTable.Layout_ability_persondetail);
initPDSilceComponents(intent.getStringParam(" full name "));
System.out.println(" Here we go -----》》》》》》");
}
@Override
protected void onInactive() {
super.onInactive();
}
@Override
public void onActive() {
super.onActive();
}
@Override
public void onForeground(Intent intent) {
super.onForeground(intent);
}
@Override
protected void onBackground() {
super.onBackground();
}
@Override
protected void onStop() {
super.onStop();
}
}
4.1.6 MainAbility.java
package com.tdtxdcxm.telmanagesys;
import com.tdtxdcxm.telmanagesys.slice.MainAbilitySlice;
import ohos.aafwk.ability.Ability;
import ohos.aafwk.content.Intent;
public class MainAbility extends Ability {
@Override
public void onStart(Intent intent) {
super.onStart(intent);
super.setMainRoute(MainAbilitySlice.class.getName());
}
}
4.1.7 MyApplication.java
package com.tdtxdcxm.telmanagesys;
import ohos.aafwk.ability.AbilityPackage;
public class MyApplication extends AbilityPackage {
@Override
public void onInitialize() {
super.onInitialize();
}
}
4.1.8 PersonInfoConfig.java
package com.tdtxdcxm.telmanagesys;
import com.tdtxdcxm.telmanagesys.itemdata.PeopleItem;
import ohos.app.Context;
import ohos.data.DatabaseHelper;
import ohos.data.preferences.Preferences;
import java.util.ArrayList;
import java.util.List;
public class PeopleInfoConfig {
private static final String peoplelistfilename = "peopleinfo.ple";
public static void readData(Context context, List<PeopleItem> list){
list.clear();
System.out.println("--------------》》》》 Here it is !");
DatabaseHelper databaseHelper = new DatabaseHelper(context);
Preferences preferences = databaseHelper.getPreferences(peoplelistfilename);
String namelist = preferences.getString(" name "," Please add a contact ").toString();
System.out.println(namelist);
String[] pername = namelist.split(",");
if(pername[0].equals("")){
list.add(new PeopleItem(" Please add a contact "));
return;
}
for(int i = 0;i < pername.length;i++){
System.out.println(" name :"+pername[i]);
list.add(new PeopleItem(pername[i]));
}
}
public static String[] readPersonData(Context context,String name){
String[] personinfo = new String[9];
DatabaseHelper databaseHelper = new DatabaseHelper(context);
Preferences preferences = databaseHelper.getPreferences(name+".tdtx");
personinfo[0] = preferences.getString(" full name ","");
personinfo[1] = preferences.getString(" Telephone ","");
personinfo[2] = preferences.getString(" Landline ","");
personinfo[3] = preferences.getString(" mailbox ","");
personinfo[4] = preferences.getString(" Other mailboxes ","");
personinfo[5] = preferences.getString(" Work unit ","");
personinfo[6] = preferences.getString(" Other units ","");
personinfo[7] = preferences.getString(" Address ","");
personinfo[8] = preferences.getString(" Other addresses ","");
return personinfo;
}
public static void writeData(Context context, String[] personinfo){
DatabaseHelper databaseHelper = new DatabaseHelper(context);
Preferences preferences = databaseHelper.getPreferences(peoplelistfilename);
List<PeopleItem> tlist = new ArrayList<>();
String namelist;
namelist = preferences.getString(" name ","").toString();
System.out.println("writedata namelistfile--->"+namelist);
if(namelist.equals("")){
preferences.putString(" name ",personinfo[0]);
}
else
{
preferences.putString(" name ",namelist+","+personinfo[0]);
}
preferences.flushSync();
DatabaseHelper personfile_databaseHelper = new DatabaseHelper(context);
Preferences person_preferences = personfile_databaseHelper.getPreferences(personinfo[0]+".tdtx");
person_preferences.putString(" full name ",personinfo[0]);
person_preferences.putString(" Telephone ",personinfo[1]);
person_preferences.putString(" Landline ",personinfo[2]);
person_preferences.putString(" mailbox ",personinfo[3]);
person_preferences.putString(" Other mailboxes ",personinfo[4]);
person_preferences.putString(" Work unit ",personinfo[5]);
person_preferences.putString(" Other units ",personinfo[6]);
person_preferences.putString(" Address ",personinfo[7]);
person_preferences.putString(" Other addresses ",personinfo[8]);
person_preferences.flushSync();
}
public static void writePersonData(Context context, String[] personinfo){
DatabaseHelper personfile_databaseHelper = new DatabaseHelper(context);
Preferences person_preferences = personfile_databaseHelper.getPreferences(personinfo[0]+".tdtx");
person_preferences.putString(" full name ",personinfo[0]);
person_preferences.putString(" Telephone ",personinfo[1]);
person_preferences.putString(" Landline ",personinfo[2]);
person_preferences.putString(" mailbox ",personinfo[3]);
person_preferences.putString(" Other mailboxes ",personinfo[4]);
person_preferences.putString(" Work unit ",personinfo[5]);
person_preferences.putString(" Other units ",personinfo[6]);
person_preferences.putString(" Address ",personinfo[7]);
person_preferences.putString(" Other addresses ",personinfo[8]);
person_preferences.flushSync();
}
public static void deleteData(Context context, String personname){
DatabaseHelper databaseHelper = new DatabaseHelper(context);
Preferences preferences = databaseHelper.getPreferences(peoplelistfilename);
List<PeopleItem> tlist = new ArrayList<>();
String namelist;
namelist = preferences.getString(" name ","").toString();
System.out.println("writedata namelistfile--->"+namelist);
if(namelist.equals("")){
}
else
{
String[] names = namelist.split(",");
StringBuilder stringBuilder = new StringBuilder();
int k = 0;
for(int i = 0;i < names.length;i++){
System.out.println("------>>>>"+stringBuilder.toString());
if(names[i].equals(personname) == false){
if(k != 0){
stringBuilder.append(",");
stringBuilder.append(names[i]);
k++;
continue;
}
stringBuilder.append(names[i]);
k++;
}
}
namelist = stringBuilder.toString();
preferences.putString(" name ",namelist);
}
preferences.flushSync();
DatabaseHelper personfile_databaseHelper = new DatabaseHelper(context);
//Preferences person_preferences = personfile_databaseHelper.getPreferences(personname+".tdtx");
personfile_databaseHelper.deletePreferences(personname+".tdtx");
personfile_databaseHelper.removePreferencesFromCache(personname+".tdtx");
}
}
4.2 XML Code
4.2.1 UI background XML
4.2.1.1 background_ability_main.xml
<?xml version="1.0" encoding="UTF-8" ?>
<shape xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:shape="rectangle">
<solid ohos:color="#8AFFFFFF"/>
</shape>
4.2.1.2 background_bottombutton.xml
<?xml version="1.0" encoding="UTF-8" ?>
<shape xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:shape="rectangle">
<corners ohos:radius="50vp"/>
</shape>
4.2.1.3 background_ddl1.xml
<?xml version="1.0" encoding="UTF-8" ?>
<shape xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:shape="rectangle">
<corners ohos:radius="50vp"/>
<stroke ohos:width="3vp" ohos:color="#FF1952C3"/>
<solid ohos:color="#48DDDBDB"/>
</shape>
4.2.1.4 background_ddl2.xml
<?xml version="1.0" encoding="UTF-8" ?>
<shape xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:shape="rectangle">
<corners ohos:radius="10vp"/>
<stroke ohos:width="5vp" ohos:color="#FFD1AEF1"/>
<solid ohos:color="#48DDDBDB"/>
</shape>
4.2.1.5 background_ddl3.xml
<?xml version="1.0" encoding="UTF-8" ?>
<shape xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:shape="rectangle">
<corners ohos:radius="50vp"/>
<stroke ohos:width="3vp" ohos:color="#FFFFFFFF"/>
<solid ohos:color="#FFFFFFFF"/>
</shape>
4.2.1.6 background_edit_addbutton.xml
<?xml version="1.0" encoding="UTF-8" ?>
<shape xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:shape="rectangle">
<corners ohos:radius="100vp"/>
<stroke ohos:width="2vp" ohos:color="#FF3FFF18"/>
<solid ohos:color="#FFFFFFFF"/>
</shape>
4.2.1.7 background_edit_addnametext.xml
<?xml version="1.0" encoding="UTF-8" ?>
<shape xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:shape="rectangle">
<corners ohos:radius="5vp"/>
<stroke ohos:width="2vp" ohos:color="#FF18B6FF"/>
<solid ohos:color="#FFFFFFFF"/>
</shape>
4.2.1.8 background_edit_addtfd.xml
<?xml version="1.0" encoding="UTF-8" ?>
<shape xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:shape="rectangle">
<corners ohos:radius="20vp"/>
<stroke ohos:width="2vp" ohos:color="#FFF5AC17"/>
<solid ohos:color="#FFFFFFFF"/>
</shape>
4.2.1.9 background_edit_topbut.xml
<?xml version="1.0" encoding="UTF-8" ?>
<shape xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:shape="rectangle">
<corners ohos:radius="3vp"/>
<stroke ohos:width="2vp" ohos:color="#FF2E4658"/>
<solid ohos:color="#FFFFFFFF"/>
</shape>
4.2.1.10 background_listcontainer_item.xml
<?xml version="1.0" encoding="UTF-8" ?>
<shape xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:shape="rectangle">
<corners ohos:radius="10vp"/>
<stroke ohos:width="3vp" ohos:color="#FFAECEF1"/>
<solid ohos:color="#48FFFFFF"/>
</shape>
4.2.1.11 background_people_listcontainer.xml
<?xml version="1.0" encoding="UTF-8" ?>
<shape xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:shape="rectangle">
<corners ohos:radius="10vp"/>
<solid ohos:color="#48DDDBDB"/>
</shape>
4.2.1.12 background_searchbutton.xml
<?xml version="1.0" encoding="UTF-8" ?>
<shape xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:shape="rectangle">
<corners ohos:radius="50vp"/>
<solid ohos:color="#4836E5F3"/>
</shape>
4.2.1.13 background_searchtextfield.xml
<?xml version="1.0" encoding="UTF-8" ?>
<shape xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:shape="rectangle">
<corners ohos:radius="50vp"/>
<solid ohos:color="#48FDC42E"/>
</shape>
4.2.2 Main page and sub layout XML
4.2.2.1 ability_config.xml
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:id="$+id:config_area_rootdl" ohos:height="match_parent" ohos:width="match_parent" ohos:orientation="vertical" ohos:alignment="horizontal_center">
<RadioContainer ohos:id="$+id:config_radioContainer" ohos:height="200vp" ohos:width="match_parent" ohos:margin="10vp" ohos:orientation="vertical" ohos:alignment="horizontal_center">
<RadioButton ohos:id="$+id:bottombar_default" ohos:height="0" ohos:weight="1" ohos:width="match_parent" ohos:text=" Bottom navigation bar : Default color " ohos:text_alignment="center" ohos:text_size="20vp" ohos:multiple_lines="true" ohos:text_color_on="#FF0C7F9B" ohos:text_color_off="#FFD1C3EA" ohos:background_element="$graphic:background_edit_addtfd">
</RadioButton>
<RadioButton ohos:id="$+id:bottombar_dark" ohos:height="0" ohos:weight="1" ohos:width="match_parent" ohos:text=" Bottom navigation bar : Dark color matching " ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color_on="#FF0C7F9B" ohos:text_color_off="#FFD1C3EA" ohos:background_element="$graphic:background_edit_addtfd">
</RadioButton>
<RadioButton ohos:id="$+id:bottombar_light" ohos:height="0" ohos:weight="1" ohos:width="match_parent" ohos:text=" Bottom navigation bar : Light color " ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color_on="#FF0C7F9B" ohos:text_color_off="#FFD1C3EA" ohos:background_element="$graphic:background_edit_addtfd">
</RadioButton>
<RadioButton ohos:id="$+id:bottombar_simple" ohos:height="0" ohos:weight="1" ohos:width="match_parent" ohos:text=" Bottom navigation bar : Simple color " ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color_on="#FF0C7F9B" ohos:text_color_off="#FFD1C3EA" ohos:background_element="$graphic:background_edit_addtfd">
</RadioButton>
</RadioContainer>
</DirectionalLayout>
4.2.2.2 ability_config_topsublayout.xml
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:id="$+id:config_top_sublayout" ohos:height="match_parent" ohos:width="match_parent" ohos:top_margin="5vp" ohos:left_margin="20vp" ohos:right_margin="20vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Button ohos:id="$+id:config_resetbut" ohos:height="match_parent" ohos:width="0" ohos:weight="1" ohos:text=" Default " ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="#FF0E2A85" ohos:background_element="$graphic:background_edit_topbut">
</Button>
<Button ohos:id="$+id:config_okbut" ohos:height="match_parent" ohos:width="0" ohos:weight="1" ohos:left_margin="20vp" ohos:text=" application " ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="#FF0E2A85" ohos:background_element="$graphic:background_edit_topbut">
</Button>
</DirectionalLayout>
4.2.2.3 ability_edit.xml
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:id="$+id:edit_area_rootdl" ohos:height="match_parent" ohos:width="match_parent" ohos:orientation="vertical" ohos:alignment="horizontal_center">
<DirectionalLayout ohos:id="$+id:edit_name_dlyt" ohos:height="60vp" ohos:width="match_parent" ohos:margin="10vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Text ohos:id="$+id:edit_nametext" ohos:height="match_parent" ohos:width="0" ohos:weight="3" ohos:text=" To be input " ohos:text_alignment="center" ohos:multiple_lines="true" ohos:auto_font_size="true" ohos:text_color="#FF6D37D2" ohos:background_element="$graphic:background_edit_addnametext">
</Text>
<TextField ohos:id="$+id:edit_nametfd" ohos:height="match_parent" ohos:width="0" ohos:weight="7" ohos:hint=" full name " ohos:text_alignment="center" ohos:text_size="20vp" ohos:hint_color="gray" ohos:background_element="$graphic:background_edit_addtfd">
</TextField>
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:edit_tel_dlyt" ohos:height="40vp" ohos:width="match_parent" ohos:margin="5vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Button ohos:id="$+id:edit_addtel_but" ohos:height="match_parent" ohos:width="40vp" ohos:text="+" ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="green" ohos:background_element="$graphic:background_edit_addbutton">
</Button>
<TextField ohos:id="$+id:edit_teltfd" ohos:height="match_parent" ohos:width="match_parent" ohos:hint=" Telephone " ohos:text_alignment="center" ohos:text_size="20vp" ohos:hint_color="gray" ohos:background_element="$graphic:background_edit_addtfd">
</TextField>
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:edit_email_dlyt" ohos:height="40vp" ohos:width="match_parent" ohos:margin="5vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Button ohos:id="$+id:edit_addemail_but" ohos:height="match_parent" ohos:width="40vp" ohos:text="+" ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="green" ohos:background_element="$graphic:background_edit_addbutton">
</Button>
<TextField ohos:id="$+id:edit_emailtfd" ohos:height="match_parent" ohos:width="match_parent" ohos:hint=" mail " ohos:text_alignment="center" ohos:text_size="20vp" ohos:hint_color="gray" ohos:background_element="$graphic:background_edit_addtfd">
</TextField>
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:edit_work_dlyt" ohos:height="40vp" ohos:width="match_parent" ohos:margin="5vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Button ohos:id="$+id:edit_addwork_but" ohos:height="match_parent" ohos:width="40vp" ohos:text="+" ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="green" ohos:background_element="$graphic:background_edit_addbutton">
</Button>
<TextField ohos:id="$+id:edit_worktfd" ohos:height="match_parent" ohos:width="match_parent" ohos:hint=" Work unit " ohos:text_alignment="center" ohos:text_size="20vp" ohos:hint_color="gray" ohos:background_element="$graphic:background_edit_addtfd">
</TextField>
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:edit_address_dlyt" ohos:height="40vp" ohos:width="match_parent" ohos:margin="5vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Button ohos:id="$+id:edit_addaddress_but" ohos:height="match_parent" ohos:width="40vp" ohos:text="+" ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="green" ohos:background_element="$graphic:background_edit_addbutton">
</Button>
<TextField ohos:id="$+id:edit_addresstfd" ohos:height="match_parent" ohos:width="match_parent" ohos:hint=" Address " ohos:text_alignment="center" ohos:text_size="20vp" ohos:hint_color="gray" ohos:background_element="$graphic:background_edit_addtfd">
</TextField>
</DirectionalLayout>
</DirectionalLayout>
4.2.2.4 ability_edit_addresssublayout.xml
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:id="$+id:edit_addressanother_rootdl" ohos:height="40vp" ohos:width="match_parent" ohos:margin="5vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Button ohos:id="$+id:edit_addressanother_addaddress_but" ohos:height="match_parent" ohos:width="40vp" ohos:text="" ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="green">
</Button>
<TextField ohos:id="$+id:edit_addressanother_addresstfd" ohos:height="match_parent" ohos:width="match_parent" ohos:hint=" Other addresses " ohos:text_alignment="center" ohos:text_size="20vp" ohos:hint_color="gray" ohos:background_element="$graphic:background_edit_addtfd">
</TextField>
</DirectionalLayout>
4.2.2.5 ability_edit_emailsublayout.xml
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:id="$+id:edit_emailanother_rootdl" ohos:height="40vp" ohos:width="match_parent" ohos:margin="5vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Button ohos:id="$+id:edit_emailanother_addemail_but" ohos:height="match_parent" ohos:width="40vp" ohos:text="" ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="green">
</Button>
<TextField ohos:id="$+id:edit_emailanother_emailtfd" ohos:height="match_parent" ohos:width="match_parent" ohos:hint=" Other mailboxes " ohos:text_alignment="center" ohos:text_size="20vp" ohos:hint_color="gray" ohos:background_element="$graphic:background_edit_addtfd">
</TextField>
</DirectionalLayout>
4.2.2.6 ability_edit_telsublayout.xml
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:id="$+id:edit_telanother_rootdl" ohos:height="40vp" ohos:width="match_parent" ohos:margin="5vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Button ohos:id="$+id:edit_telanother_addtel_but" ohos:height="match_parent" ohos:width="40vp" ohos:text="" ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="green">
</Button>
<TextField ohos:id="$+id:edit_telanother_teltfd" ohos:height="match_parent" ohos:width="match_parent" ohos:hint=" Landline " ohos:text_alignment="center" ohos:text_size="20vp" ohos:hint_color="gray" ohos:background_element="$graphic:background_edit_addtfd">
</TextField>
</DirectionalLayout>
4.2.2.7 ability_edit_topsublayout.xml
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:id="$+id:edit_top_sublayout" ohos:height="match_parent" ohos:width="match_parent" ohos:top_margin="5vp" ohos:left_margin="20vp" ohos:right_margin="20vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Button ohos:id="$+id:edit_deletebut" ohos:height="match_parent" ohos:width="0" ohos:weight="1" ohos:right_margin="20vp" ohos:text=" Empty " ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="#FF0E2A85" ohos:background_element="$graphic:background_edit_topbut">
</Button>
<Button ohos:id="$+id:edit_resetbut" ohos:height="match_parent" ohos:width="0" ohos:weight="1" ohos:text=" Reset " ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="#FF0E2A85" ohos:background_element="$graphic:background_edit_topbut">
</Button>
<Button ohos:id="$+id:edit_okbut" ohos:height="match_parent" ohos:width="0" ohos:weight="1" ohos:left_margin="20vp" ohos:text=" confirm " ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="#FF0E2A85" ohos:background_element="$graphic:background_edit_topbut">
</Button>
</DirectionalLayout>
4.2.2.8 ability_edit_worksublayout.xml
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:id="$+id:edit_workanother_rootdl" ohos:height="40vp" ohos:width="match_parent" ohos:margin="5vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Button ohos:id="$+id:edit_workanother_addwork_but" ohos:height="match_parent" ohos:width="40vp" ohos:text="" ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="green">
</Button>
<TextField ohos:id="$+id:edit_workanother_worktfd" ohos:height="match_parent" ohos:width="match_parent" ohos:hint=" Other units " ohos:text_alignment="center" ohos:text_size="20vp" ohos:hint_color="gray" ohos:background_element="$graphic:background_edit_addtfd">
</TextField>
</DirectionalLayout>
4.2.2.9 ability_listcontainer_itemlayout
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:id="$+id:item_rootdl" ohos:height="35vp" ohos:width="match_parent" ohos:orientation="horizontal" ohos:background_element="$graphic:background_listcontainer_item">
<Text ohos:id="$+id:item_text" ohos:height="match_parent" ohos:width="match_parent" ohos:text=" test " ohos:text_size="20vp" ohos:text_alignment="vertical_center" ohos:text_color="black">
</Text>
</DirectionalLayout>
4.2.2.10 ability_main.xml
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:id="$+id:main_rootdl" ohos:height="match_parent" ohos:width="match_parent" ohos:orientation="vertical" ohos:alignment="horizontal_center" ohos:background_element="$graphic:background_ability_main">
<DirectionalLayout ohos:id="$+id:main_rootdl_ddl1" ohos:height="0" ohos:weight="0.6" ohos:width="match_parent" ohos:orientation="vertical" ohos:alignment="horizontal_center">
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:main_rootdl_ddl2" ohos:height="0" ohos:weight="8.8" ohos:width="match_parent" ohos:top_margin="5vp" ohos:background_element="$graphic:background_ddl2">
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:main_rootdl_ddl3" ohos:height="0" ohos:weight="0.6" ohos:width="match_parent" ohos:top_margin="5vp" ohos:bottom_margin="5vp" ohos:left_margin="45vp" ohos:right_margin="45vp" ohos:orientation="horizontal" ohos:alignment="vertical_center" ohos:background_element="$graphic:background_ddl3">
<Button ohos:id="$+id:ddl3_butpeople" ohos:height="match_parent" ohos:width="0" ohos:weight="1" ohos:margin="3vp" ohos:text="$string:people" ohos:text_alignment="center" ohos:text_size="25vp" ohos:text_color="#FFB35353" ohos:background_element="$graphic:background_bottombutton">
</Button>
<Button ohos:id="$+id:ddl3_butedit" ohos:height="match_parent" ohos:width="0" ohos:weight="1" ohos:margin="3vp" ohos:text="$string:edit" ohos:text_alignment="center" ohos:text_size="25vp" ohos:text_color="#FF1086CA" ohos:background_element="$graphic:background_bottombutton">
</Button>
<Button ohos:id="$+id:ddl3_butconfig" ohos:height="match_parent" ohos:width="0" ohos:weight="1" ohos:margin="3vp" ohos:text="$string:config" ohos:text_alignment="center" ohos:text_size="25vp" ohos:text_color="#FF79086A" ohos:background_element="$graphic:background_bottombutton">
</Button>
</DirectionalLayout>
</DirectionalLayout>
4.2.2.11 ability_people_listcontainerlayout.xml
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:id="$+id:people_listcontainer_sublayout" ohos:height="match_parent" ohos:width="match_parent" ohos:orientation="vertical" ohos:alignment="horizontal_center" ohos:background_element="$graphic:background_people_listcontainer">
<ListContainer ohos:id="$+id:people_listcontainer" ohos:height="match_parent" ohos:width="match_parent" ohos:orientation="vertical" ohos:rebound_effect="true">
</ListContainer>
</DirectionalLayout>
4.2.2.12 ability_persondetail.xml
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:id="$+id:persondetail_rootdl" ohos:height="match_parent" ohos:width="match_parent" ohos:orientation="vertical" ohos:alignment="horizontal_center" ohos:background_element="$graphic:background_ability_main">
<DirectionalLayout ohos:id="$+id:persondetail_rootdl_ddl1" ohos:height="0" ohos:weight="0.6" ohos:width="match_parent" ohos:top_margin="5vp" ohos:left_margin="20vp" ohos:right_margin="20vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Button ohos:id="$+id:persondetail_backbut" ohos:height="match_parent" ohos:width="0" ohos:weight="1" ohos:right_margin="20vp" ohos:text="$string:back" ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="#FF0E2A85" ohos:background_element="$graphic:background_edit_topbut">
</Button>
<Button ohos:id="$+id:persondetail_nobut" ohos:height="match_parent" ohos:width="0" ohos:weight="1" ohos:text=" Cancel " ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="#FF0E2A85" ohos:background_element="$graphic:background_edit_topbut">
</Button>
<Button ohos:id="$+id:persondetail_okeditbut" ohos:height="match_parent" ohos:width="0" ohos:weight="1" ohos:left_margin="20vp" ohos:text=" edit " ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="#FF0E2A85" ohos:background_element="$graphic:background_edit_topbut">
</Button>
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:persondetail_rootdl_ddl2" ohos:height="0" ohos:weight="8.8" ohos:width="match_parent" ohos:top_margin="5vp" ohos:background_element="$graphic:background_ddl2">
<DirectionalLayout ohos:id="$+id:persondetail_name_dlyt" ohos:height="60vp" ohos:width="match_parent" ohos:margin="10vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Text ohos:id="$+id:persondetail_nametext" ohos:height="match_parent" ohos:width="0" ohos:weight="3" ohos:text="error" ohos:text_alignment="center" ohos:multiple_lines="true" ohos:auto_font_size="true" ohos:text_color="#FF6D37D2" ohos:background_element="$graphic:background_edit_addnametext">
</Text>
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:persondetail_tel_dlyt" ohos:height="40vp" ohos:width="match_parent" ohos:margin="5vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Text ohos:id="$+id:persondetail_teltext" ohos:height="match_parent" ohos:width="60vp" ohos:text=" Telephone " ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="green" ohos:background_element="$graphic:background_edit_addbutton">
</Text>
<TextField ohos:id="$+id:persondetail_teltfd" ohos:height="match_parent" ohos:width="match_parent" ohos:hint=" Telephone " ohos:text_alignment="center" ohos:text_size="20vp" ohos:hint_color="gray" ohos:background_element="$graphic:background_edit_addtfd">
</TextField>
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:persondetail_tel_dlyt2" ohos:height="40vp" ohos:width="match_parent" ohos:margin="5vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Text ohos:id="$+id:persondetail_teltext2" ohos:height="match_parent" ohos:width="60vp" ohos:text=" " ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="green">
</Text>
<TextField ohos:id="$+id:persondetail_teltfd2" ohos:height="match_parent" ohos:width="match_parent" ohos:hint=" Landline " ohos:text_alignment="center" ohos:text_size="20vp" ohos:hint_color="gray" ohos:background_element="$graphic:background_edit_addtfd">
</TextField>
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:persondetail_email_dlyt" ohos:height="40vp" ohos:width="match_parent" ohos:margin="5vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Text ohos:id="$+id:persondetail_addemail_but" ohos:height="match_parent" ohos:width="60vp" ohos:text=" mail " ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="green" ohos:background_element="$graphic:background_edit_addbutton">
</Text>
<TextField ohos:id="$+id:persondetail_emailtfd" ohos:height="match_parent" ohos:width="match_parent" ohos:hint=" mail " ohos:text_alignment="center" ohos:text_size="20vp" ohos:hint_color="gray" ohos:background_element="$graphic:background_edit_addtfd">
</TextField>
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:persondetail_email_dlyt2" ohos:height="40vp" ohos:width="match_parent" ohos:margin="5vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Text ohos:id="$+id:persondetail_addemail_but2" ohos:height="match_parent" ohos:width="60vp" ohos:text=" " ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="green">
</Text>
<TextField ohos:id="$+id:persondetail_emailtfd2" ohos:height="match_parent" ohos:width="match_parent" ohos:hint=" Other mailboxes " ohos:text_alignment="center" ohos:text_size="20vp" ohos:hint_color="gray" ohos:background_element="$graphic:background_edit_addtfd">
</TextField>
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:persondetail_work_dlyt" ohos:height="40vp" ohos:width="match_parent" ohos:margin="5vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Text ohos:id="$+id:persondetail_addwork_but" ohos:height="match_parent" ohos:width="60vp" ohos:text=" Company " ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="green" ohos:background_element="$graphic:background_edit_addbutton">
</Text>
<TextField ohos:id="$+id:persondetail_worktfd" ohos:height="match_parent" ohos:width="match_parent" ohos:hint=" Work unit " ohos:text_alignment="center" ohos:text_size="20vp" ohos:hint_color="gray" ohos:background_element="$graphic:background_edit_addtfd">
</TextField>
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:persondetail_work_dlyt2" ohos:height="40vp" ohos:width="match_parent" ohos:margin="5vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Text ohos:id="$+id:persondetail_addwork_but2" ohos:height="match_parent" ohos:width="60vp" ohos:text=" " ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="green">
</Text>
<TextField ohos:id="$+id:persondetail_worktfd2" ohos:height="match_parent" ohos:width="match_parent" ohos:hint=" Other units " ohos:text_alignment="center" ohos:text_size="20vp" ohos:hint_color="gray" ohos:background_element="$graphic:background_edit_addtfd">
</TextField>
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:persondetail_address_dlyt" ohos:height="40vp" ohos:width="match_parent" ohos:margin="5vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Button ohos:id="$+id:persondetail_addaddress_but" ohos:height="match_parent" ohos:width="60vp" ohos:text=" Address " ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="green" ohos:background_element="$graphic:background_edit_addbutton">
</Button>
<TextField ohos:id="$+id:persondetail_addresstfd" ohos:height="match_parent" ohos:width="match_parent" ohos:hint=" Address " ohos:text_alignment="center" ohos:text_size="20vp" ohos:hint_color="gray" ohos:background_element="$graphic:background_edit_addtfd">
</TextField>
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:persondetail_address_dlyt2" ohos:height="40vp" ohos:width="match_parent" ohos:margin="5vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
<Button ohos:id="$+id:persondetail_addaddress_but2" ohos:height="match_parent" ohos:width="60vp" ohos:text=" " ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="green">
</Button>
<TextField ohos:id="$+id:persondetail_addresstfd2" ohos:height="match_parent" ohos:width="match_parent" ohos:hint=" Other addresses " ohos:text_alignment="center" ohos:text_size="20vp" ohos:hint_color="gray" ohos:background_element="$graphic:background_edit_addtfd">
</TextField>
</DirectionalLayout>
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:persondetail_rootdl_ddl3" ohos:height="0" ohos:weight="0.6" ohos:width="match_parent" ohos:top_margin="5vp" ohos:bottom_margin="5vp" ohos:left_margin="45vp" ohos:right_margin="45vp" ohos:orientation="horizontal" ohos:alignment="vertical_center">
</DirectionalLayout>
</DirectionalLayout>
4.2.2.13 ability_search_topsublayout.xml
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:id="$+id:search_top_sublayout" ohos:height="match_parent" ohos:width="match_parent" ohos:top_margin="5vp" ohos:left_margin="20vp" ohos:right_margin="20vp" ohos:orientation="horizontal" ohos:alignment="vertical_center" ohos:background_element="$graphic:background_ddl1">
<TextField ohos:id="$+id:search_tfd" ohos:height="match_parent" ohos:width="0" ohos:weight="8" ohos:hint=" Please enter the contact ......" ohos:text_alignment="center" ohos:text_size="20vp" ohos:hint_color="gray" ohos:background_element="$graphic:background_searchtextfield">
</TextField>
<Button ohos:id="$+id:search_but" ohos:height="match_parent" ohos:width="0" ohos:weight="2" ohos:text=" lookup " ohos:text_alignment="center" ohos:text_size="20vp" ohos:text_color="#FF186992" ohos:background_element="$graphic:background_searchbutton">
</Button>
</DirectionalLayout>
5. app Screenshot ( The remote simulator runs )
5.1 People page
5.2 Contact details page
Click on “ edit ”, Will enter the editing state , The button changes to “ preservation ” Button
5.3 Edit page
Click one of them “+” Button , A new line of input box will be added , Click on “-” The new input box will be subtracted
Click on “ Empty ” The contents of the input box will be cleared , At the same time, because the name is input , Then hide “ confirm ” Button
Click on “ Reset ”, All expanded lines will be subtracted , Return to the initial state
5.4 Setup page
After clicking an option , Click again “ application ”, Will execute options
5.5 Delete Contact gif chart ( Long press Delete )
5.6 People search gif chart
6. app Run the video ( Remote real machine debugging and running )
be based on ListContainer Address book management system / telephone book
边栏推荐
猜你喜欢
HackMyvm靶機系列(3)-visions
HackMyvm靶机系列(2)-warrior
Network technology related topics
图书管理系统
Yugu p1012 spelling +p1019 word Solitaire (string)
On the idea of vulnerability discovery
Wei Shen of Peking University revealed the current situation: his class is not very good, and there are only 5 or 6 middle-term students left after leaving class
How to turn wechat applet into uniapp
外网打点(信息收集)
captcha-killer验证码识别插件
随机推荐
Harmonyos JS demo application development
【数据库 三大范式】一看就懂
Feature extraction and detection 14 plane object recognition
7-5 走楼梯升级版(PTA程序设计)
. How to upload XMIND files to Jinshan document sharing online editing?
7-15 h0161. 求最大公约数和最小公倍数(PTA程序设计)
XSS之冷门事件
Network technology related topics
Strengthen basic learning records
7-7 7003 组合锁(PTA程序设计)
Record a penetration of the cat shed from outside to inside. Library operation extraction flag
7-4 散列表查找(PTA程序设计)
Hackmyvm target series (4) -vulny
Low income from doing we media? 90% of people make mistakes in these three points
【头歌educoder数据表中数据的插入、修改和删除】
7-14 错误票据(PTA程序设计)
sqqyw(淡然点图标系统)漏洞复现和74cms漏洞复现
[VMware abnormal problems] problem analysis & Solutions
A complete collection of papers on text recognition
Nuxtjs quick start (nuxt2)