SingleChildScrollView in Flutter

byFlutter hero -
0

 

SingleChildScrollView in Flutter

Flutter Single child Scroll view

    body: Padding(
          padding: const EdgeInsets.all(8.0),
          child: SingleChildScrollView(
            child: Column(
              children: [
                SizedBox(height: 30),
                Row(
                  children: [
                    Text(
                      "Horizontal Scroll",
                      style: TextStyle(color: Colors.white, fontSize: 20),
                    ),
                  ],
                ),
                SingleChildScrollView(
                  scrollDirection: Axis.horizontal,
                  child: Row(children: [
                    Container(
                      margin: EdgeInsets.all(10),
                      width: 300,
                      height: 100,
                      padding: EdgeInsets.all(20),
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(10),
                        color: Colors.deepPurple.shade400,
                      ),
                      child: Center(child: Text("YOUTUBE")),
                    ),
                    Container(
                      margin: EdgeInsets.all(10),
                      width: 300,
                      height: 100,
                      padding: EdgeInsets.all(20),
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(10),
                        color: Colors.deepPurple.shade400,
                      ),
                      child: Center(child: Text("YOUTUBE")),
                    ),
                    Container(
                      margin: EdgeInsets.all(10),
                      width: 300,
                      height: 100,
                      padding: EdgeInsets.all(20),
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(10),
                        color: Colors.deepPurple.shade400,
                      ),
                      child: Center(child: Text("YOUTUBE")),
                    ),
                    Container(
                      margin: EdgeInsets.all(10),
                      width: 300,
                      height: 100,
                      padding: EdgeInsets.all(20),
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(10),
                        color: Colors.deepPurple.shade400,
                      ),
                      child: Center(child: Text("YOUTUBE")),
                    ),
                    Container(
                      margin: EdgeInsets.all(10),
                      width: 300,
                      height: 100,
                      padding: EdgeInsets.all(20),
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(10),
                        color: Colors.deepPurple.shade400,
                      ),
                      child: Center(child: Text("YOUTUBE")),
                    ),
                    Container(
                      margin: EdgeInsets.all(10),
                      width: 300,
                      height: 100,
                      padding: EdgeInsets.all(20),
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(10),
                        color: Colors.deepPurple.shade400,
                      ),
                      child: Center(child: Text("YOUTUBE")),
                    ),
                    Container(
                      margin: EdgeInsets.all(10),
                      width: 300,
                      height: 100,
                      padding: EdgeInsets.all(20),
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(10),
                        color: Colors.deepPurple.shade400,
                      ),
                      child: Center(child: Text("YOUTUBE")),
                    ),
                    Container(
                      margin: EdgeInsets.all(10),
                      width: 300,
                      height: 100,
                      padding: EdgeInsets.all(20),
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(10),
                        color: Colors.deepPurple.shade400,
                      ),
                      child: Center(child: Text("YOUTUBE")),
                    ),
                    Container(
                      margin: EdgeInsets.all(10),
                      width: 300,
                      height: 100,
                      padding: EdgeInsets.all(20),
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(10),
                        color: Colors.deepPurple.shade400,
                      ),
                      child: Center(child: Text("YOUTUBE")),
                    ),
                    Container(
                      margin: EdgeInsets.all(10),
                      width: 300,
                      height: 100,
                      padding: EdgeInsets.all(20),
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(10),
                        color: Colors.deepPurple.shade400,
                      ),
                      child: Center(child: Text("YOUTUBE")),
                    ),
                    Container(
                      margin: EdgeInsets.all(10),
                      width: 300,
                      height: 100,
                      padding: EdgeInsets.all(20),
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(10),
                        color: Colors.deepPurple.shade400,
                      ),
                      child: Center(child: Text("YOUTUBE")),
                    ),
                  ]),
                ),
                SizedBox(height: 30),
                Row(
                  children: [
                    Text(
                      "Veritcal Scroll",
                      style: TextStyle(color: Colors.white, fontSize: 20),
                    ),
                  ],
                ),
                Container(
                  height: 500,
                  child: SingleChildScrollView(
                      child: Column(
                    children: [
                      Container(
                        margin: EdgeInsets.all(10),
                        width: 300,
                        height: 100,
                        padding: EdgeInsets.all(20),
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(10),
                          color: Colors.deepPurple.shade400,
                        ),
                        child: Center(child: Text("YOUTUBE")),
                      ),
                      Container(
                        margin: EdgeInsets.all(10),
                        width: 300,
                        height: 100,
                        padding: EdgeInsets.all(20),
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(10),
                          color: Colors.deepPurple.shade400,
                        ),
                        child: Center(child: Text("YOUTUBE")),
                      ),
                      Container(
                        margin: EdgeInsets.all(10),
                        width: 300,
                        height: 100,
                        padding: EdgeInsets.all(20),
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(10),
                          color: Colors.deepPurple.shade400,
                        ),
                        child: Center(child: Text("YOUTUBE")),
                      ),
                      Container(
                        margin: EdgeInsets.all(10),
                        width: 300,
                        height: 100,
                        padding: EdgeInsets.all(20),
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(10),
                          color: Colors.deepPurple.shade400,
                        ),
                        child: Center(child: Text("YOUTUBE")),
                      ),
                      Container(
                        margin: EdgeInsets.all(10),
                        width: 300,
                        height: 100,
                        padding: EdgeInsets.all(20),
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(10),
                          color: Colors.deepPurple.shade400,
                        ),
                        child: Center(child: Text("YOUTUBE")),
                      ),
                      Container(
                        margin: EdgeInsets.all(10),
                        width: 300,
                        height: 100,
                        padding: EdgeInsets.all(20),
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(10),
                          color: Colors.deepPurple.shade400,
                        ),
                        child: Center(child: Text("YOUTUBE")),
                      ),
                      Container(
                        margin: EdgeInsets.all(10),
                        width: 300,
                        height: 100,
                        padding: EdgeInsets.all(20),
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(10),
                          color: Colors.deepPurple.shade400,
                        ),
                        child: Center(child: Text("YOUTUBE")),
                      ),
                      Container(
                        margin: EdgeInsets.all(10),
                        width: 300,
                        height: 100,
                        padding: EdgeInsets.all(20),
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(10),
                          color: Colors.deepPurple.shade400,
                        ),
                        child: Center(child: Text("YOUTUBE")),
                      ),
                    ],
                  )),
                ),
                SizedBox(height: 30),
                Container(
                  margin: EdgeInsets.all(10),
                  width: 300,
                  height: 100,
                  padding: EdgeInsets.all(20),
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(10),
                    color: Colors.deepPurple.shade400,
                  ),
                  child: Center(child: Text("YOUTUBE")),
                ),
                Container(
                  margin: EdgeInsets.all(10),
                  width: 300,
                  height: 100,
                  padding: EdgeInsets.all(20),
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(10),
                    color: Colors.deepPurple.shade400,
                  ),
                  child: Center(child: Text("YOUTUBE")),
                ),
                Container(
                  margin: EdgeInsets.all(10),
                  width: 300,
                  height: 100,
                  padding: EdgeInsets.all(20),
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(10),
                    color: Colors.deepPurple.shade400,
                  ),
                  child: Center(child: Text("YOUTUBE")),
                ),
                Container(
                  margin: EdgeInsets.all(10),
                  width: 300,
                  height: 100,
                  padding: EdgeInsets.all(20),
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(10),
                    color: Colors.deepPurple.shade400,
                  ),
                  child: Center(child: Text("YOUTUBE")),
                ),
                Container(
                  margin: EdgeInsets.all(10),
                  width: 300,
                  height: 100,
                  padding: EdgeInsets.all(20),
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(10),
                    color: Colors.deepPurple.shade400,
                  ),
                  child: Center(child: Text("YOUTUBE")),
                ),
                Container(
                  margin: EdgeInsets.all(10),
                  width: 300,
                  height: 100,
                  padding: EdgeInsets.all(20),
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(10),
                    color: Colors.deepPurple.shade400,
                  ),
                  child: Center(child: Text("YOUTUBE")),
                ),
                Container(
                  margin: EdgeInsets.all(10),
                  width: 300,
                  height: 100,
                  padding: EdgeInsets.all(20),
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(10),
                    color: Colors.deepPurple.shade400,
                  ),
                  child: Center(child: Text("YOUTUBE")),
                ),
                Container(
                  margin: EdgeInsets.all(10),
                  width: 300,
                  height: 100,
                  padding: EdgeInsets.all(20),
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(10),
                    color: Colors.deepPurple.shade400,
                  ),
                  child: Center(child: Text("YOUTUBE")),
                ),
                Container(
                  margin: EdgeInsets.all(10),
                  width: 300,
                  height: 100,
                  padding: EdgeInsets.all(20),
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(10),
                    color: Colors.deepPurple.shade400,
                  ),
                  child: Center(child: Text("YOUTUBE")),
                ),
                Container(
                  margin: EdgeInsets.all(10),
                  width: 300,
                  height: 100,
                  padding: EdgeInsets.all(20),
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(10),
                    color: Colors.deepPurple.shade400,
                  ),
                  child: Center(child: Text("YOUTUBE")),
                ),
                Container(
                  margin: EdgeInsets.all(10),
                  width: 300,
                  height: 100,
                  padding: EdgeInsets.all(20),
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(10),
                    color: Colors.deepPurple.shade400,
                  ),
                  child: Center(child: Text("YOUTUBE")),
                ),
              ],
            ),
          ),
        ));
 
Tags

You may like these posts

Post a Comment

Previous Post Next Post