校园项目App开发求助：如何实现带菜单的主界面？

嘿，看你已经搭好了菜单的基础CardView框架，这很棒！我来帮你把这个菜单功能完善起来，不管是布局优化还是点击逻辑都给你捋清楚～

第一步：补全并优化布局代码 #

你给出的代码片段截断了，我先帮你补全一个完整的单菜单项CardView示例，然后再扩展成多菜单的布局：

单个菜单项的完整代码 #

<android.support.v7.widget.CardView
    android:id="@+id/card_menu_item"
    android:layout_width="160dp"
    android:layout_height="190dp"
    android:layout_margin="10dp"
    android:clickable="true"
    android:focusable="true"
    android:foreground="?android:attr/selectableItemBackground">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:gravity="center"
        android:padding="16dp">

        <!-- 菜单图标 -->
        <ImageView
            android:layout_width="60dp"
            android:layout_height="60dp"
            android:src="@drawable/ic_menu_home" <!-- 替换成你的图标资源 -->
            android:tint="@color/primaryColor"/> <!-- 可选：统一图标色调 -->

        <!-- 菜单文字 -->
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="首页"
            android:textSize="16sp"
            android:layout_marginTop="12dp"
            android:textColor="@color/textPrimary"/>

    </LinearLayout>
</android.support.v7.widget.CardView>

多菜单项的布局方案（用GridLayout） #

如果要放多个菜单项，用GridLayout来排列会更规整，比如2列的菜单：

<GridLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:columnCount="2"
    android:rowCount="2"
    android:alignmentMode="alignMargins">

    <!-- 菜单项1：首页 -->
    <android.support.v7.widget.CardView
        android:id="@+id/card_home"
        android:layout_width="0dp"
        android:layout_height="190dp"
        android:layout_margin="10dp"
        android:clickable="true"
        android:focusable="true"
        android:foreground="?android:attr/selectableItemBackground"
        android:layout_columnWeight="1">

        <!-- 内部LinearLayout和上面的单菜单项一致 -->
    </android.support.v7.widget.CardView>

    <!-- 菜单项2：个人中心 -->
    <android.support.v7.widget.CardView
        android:id="@+id/card_profile"
        android:layout_width="0dp"
        android:layout_height="190dp"
        android:layout_margin="10dp"
        android:clickable="true"
        android:focusable="true"
        android:foreground="?android:attr/selectableItemBackground"
        android:layout_columnWeight="1">

        <!-- 内部LinearLayout和上面的单菜单项一致 -->
    </android.support.v7.widget.CardView>

    <!-- 可继续添加更多菜单项，比如课程、消息等 -->
</GridLayout>

第二步：实现菜单点击逻辑 #

布局搞定后，就可以在MainActivity.java里给每个CardView添加点击事件，跳转到对应的页面：

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        // 绑定菜单项控件
        CardView homeCard = findViewById(R.id.card_home);
        CardView profileCard = findViewById(R.id.card_profile);

        // 首页点击事件：跳转到首页Activity
        homeCard.setOnClickListener(v -> {
            Intent intent = new Intent(MainActivity.this, HomeActivity.class);
            startActivity(intent);
        });

        // 个人中心点击事件：跳转到个人中心Activity
        profileCard.setOnClickListener(v -> {
            Intent intent = new Intent(MainActivity.this, ProfileActivity.class);
            startActivity(intent);
        });
    }
}

实用小技巧 #

• 记得给CardView加上android:focusable="true"，这样用遥控器或键盘操作时也能选中，提升页面的可访问性
• 如果菜单项数量较多，建议用RecyclerView + GridLayoutManager实现，能复用视图，提升性能
• 可以给CardView加app:cardElevation="4dp"属性调整阴影效果，让菜单更有层次感

内容的提问来源于stack exchange，提问作者Bianca