Skip to content

Latest commit

 

History

History
58 lines (47 loc) · 2.27 KB

README.md

File metadata and controls

58 lines (47 loc) · 2.27 KB

HoverX

Pub Version contributions welcome Maintenance Maintaner Profile views

Dart Flutter

Hover Text over Image using HoverX

Using HoverX you can achieve beautiful results on any website with little effort. Hover effects are probably the most used elements in web design, mainly because of the ease of implementing them coupled with a greatly improved user experience. HoverX create an opportunity to add interactivity to elements on a website without slowing it down.

Demo

ForTheBadge built-with-love

import 'package:flutter/material.dart';
import 'package:hoverx/hoverx.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Center(
        child: HoverX(
          title: "Hello World",
          image: NetworkImage(
              "https://images.unsplash.com/32/Mc8kW4x9Q3aRR3RkP5Im_IMG_4417.jpg?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1950&q=80"),
          hoverColor: Colors.black,
        ),
      ),
    );
  }
}