bu ekranda asagida bir dock yaptim kodlari su sekilde : 'import React, { useRef } from "react";
import {
  StyleSheet,
  Text,
  View,
  FlatList,
  TouchableOpacity,
  Image,
  ScrollView,
  Animated,
} from "react-native";
import TitleMainScreen from "../components/TitleMainScreen";
import { useFonts } from "expo-font";
import ActivitiesData from "../assets/data/ActivitiesData";
import Activities from "../components/Activities";
import Posts from "../components/Posts";
import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons";
import PostsData from "../assets/data/PostsData";

interface MeetMateMainScreenProps {
  navigation: any;
}

const MeetMateMainScreen: React.FC<MeetMateMainScreenProps> = ({
  navigation,
}) => {
  const [fontsLoaded] = useFonts({
    "Alatsi-Regular": require("../assets/fonts/Alatsi-Regular.ttf"),
    "Alata-Regular": require("../assets/fonts/Alata-Regular.ttf"),
  });

  const scrollY = useRef(new Animated.Value(0)).current;

  if (!fontsLoaded) {
    return null;
  }

  interface RenderActivitiesProps {
    item: any;
    index: number;
  }

  const RenderActivities: React.FC<RenderActivitiesProps> = ({
    item,
    index,
  }) => {
    return <Activities item={item} index={index} />;
  };

  return (
    <View style={{ flex: 1 }}>
      
        <TitleMainScreen navigation={navigation} />
 

      <ScrollView
        showsVerticalScrollIndicator={false}
      >
        <Text
          style={{
            fontSize: 20,
            fontFamily: "Alata-Regular",
            marginLeft: 20,
          }}
        >
          Activities
        </Text>
        <FlatList
          data={ActivitiesData}
          renderItem={({ item, index }) => (
            <RenderActivities item={item} index={index} />
          )}
          keyExtractor={(item) => item.id}
          horizontal={true}
          showsHorizontalScrollIndicator={false}
        />
        <FlatList
          data={PostsData}
          renderItem={({ item, index }) => (
            <Posts item={item} index={index} navigation={navigation} />
          )}
          keyExtractor={(item) => item.id}
          showsVerticalScrollIndicator={false}
     
        />
      </ScrollView>
      <View
        style={{
          position: "absolute",
          bottom: 30,
          left: 0,
          right: 0,
          height: 60,
          marginHorizontal: 20,
          borderRadius: 30,
          backgroundColor: "black",
          shadowColor: "#000",
          shadowOffset: {
            width: 0,
            height: 0,
          },
          shadowOpacity: 0.5,
          shadowRadius: 3.84,
          elevation: 5,
        }}
      >
        <View
          style={{
            flexDirection: "row",
            justifyContent: "space-between",
            alignItems: "center",
            marginHorizontal: 20,
          }}
        >
          <Ionicons name={"home"} size={30} color={"white"} />
          <Ionicons name={"search"} size={30} color={"white"} />
          <Ionicons name={"add-circle-outline"} size={50} color={"white"} />
          <MaterialCommunityIcons
            name={"account-group-outline"}
            size={30}
            color={"white"}
          />
          <Image
            source={require("../assets/images/postimage1.jpeg")}
            resizeMode="cover"
            style={{ height: 30, width: 30, borderRadius: 30 }}
          />
        </View>
      </View>
    </View>
  );
};

export default MeetMateMainScreen;

const styles = StyleSheet.create({});
' dock kismi ise surasi : '<View
        style={{
          position: "absolute",
          bottom: 30,
          left: 0,
          right: 0,
          height: 60,
          marginHorizontal: 20,
          borderRadius: 30,
          backgroundColor: "black",
          shadowColor: "#000",
          shadowOffset: {
            width: 0,
            height: 0,
          },
          shadowOpacity: 0.5,
          shadowRadius: 3.84,
          elevation: 5,
        }}
      >
        <View
          style={{
            flexDirection: "row",
            justifyContent: "space-between",
            alignItems: "center",
            marginHorizontal: 20,
          }}
        >
          <Ionicons name={"home"} size={30} color={"white"} />
          <Ionicons name={"search"} size={30} color={"white"} />
          <Ionicons name={"add-circle-outline"} size={50} color={"white"} />
          <MaterialCommunityIcons
            name={"account-group-outline"}
            size={30}
            color={"white"}
          />
          <Image
            source={require("../assets/images/postimage1.jpeg")}
            resizeMode="cover"
            style={{ height: 30, width: 30, borderRadius: 30 }}
          />
        </View>
      </View>' bu dock kisminin ekran kaydirilirken gizlenmesini istiyorum