北向应用：手机鸿蒙元程序初试

小嵌

北向应用：手机鸿蒙元程序初试, 显示效果：





点击“点击了解更多”进入下一个页面





部分代码如下：

第一个布局中

<?xml version=“1.0“ encoding=“utf-8“?>

<Directionallayout

     xmlns:ohos=“http://schemas.huawei.com/res/ohos“

     ohos:height=“match_parent“

     ohos:width=“match_parent“

     ohos:orientation=“vertical“>

     <DirectionalLayout

         ohos:width=“match_parent“

         ohos:weight=“1“>

         <Text

             ohos:width=“match_content“

             ohos:height=“match_content“

             ohos:text=“蛟龙腾飞“

             ohos:text_size=“80px“

             ohos:top_margin=“280px“

             ohos:left_margin=“50px“/>

     </DirectionalLayout>

     <DirectionalLayout

         ohos:weight=“1“

         ohos:width=“match_parent“>

         <Image

             ohos:width=“1080px“

             ohos:height=“468px“

             ohos:image_src=“$media:index12.jpg“/>

     </DirectionalLayout>

     <DirectionalLayout

         ohos:width=“match_parent“

         ohos:weight=“3“>

         <Text

             ohos:width=“match_content“

             ohos:height=“match_content“

             ohos:text_size=“60px“

             ohos:multiple_lines=“true“

             ohos:left_margin=“8px“

             ohos:text=“带你从传统的互联网、移动互联网时代“/>

         <Text

             ohos:width=“match_content“

             ohos:height=“match_content“

             ohos:text_size=“60px“

             ohos:multiple_lines=“true“

             ohos:left_margin=“8px“

             ohos:top_margin=“10px“

             ohos:text=“跳转到万物互联的智能世界!“/>

         <Text

             ohos:width=“match_content“

             ohos:height=“match_content“

             ohos:text_size=“60px“

             ohos:multiple_lines=“true“

             ohos:left_margin=“8px“

             ohos:top_margin=“10px“

             ohos:text=““/>

         <Button

             ohos:id=“$+id:jltfbutton“

             ohos:width=“match_content“

             ohos:height=“match_content“

             ohos:text=“点击了解更多“

             ohos:text_color=“red“

             ohos:text_size=“100px“

             ohos:top_margin=“400px“

             ohos:left_margin=“420px“/>

     </DirectionalLayout>

</DirectionalLayout>